快捷代码按钮对所有帖子都不起作用。只在第一个岗位工作

时间:2020-09-01 作者:Jain

我正在创建一个自定义的wordpress主题,我有点陷入了一种情况,实际上我添加了一个下载链接按钮,并在其上添加了一些Java脚本。所有帖子上的按钮显示和下载都很好,但根据Java脚本,(快捷代码按钮/下载链接按钮)只被点击了2次,2次后自动消失。

Java脚本代码只在第一篇文章中运行良好。对于其他帖子,它不起作用。

下面是我的代码:-

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
            <script>
               $(document).ready(function(){
                  var i = 0
                     $(".gotocls").click(function(){
                         i++
                            if(i == 2)
                             document.getElementsByClassName(\'gotocls\')[0].style.display = \'none\';
                    
                    });
            ``  });
     
         </script>  

          <a class="dkpdf-button gotocls" href="www.downloadlink.com"  target="_blank"><span class="dkpdf-button-icon"><i class="fa fa-file-pdf-o"></i></span> <?php echo $pdfbutton_text;?></a>`
以下是HTML代码的屏幕截图:

image

1 个回复
最合适的回答,由SO网友:Aditya Agarwal 整理而成

可以

所以我在评论中问了你一些问题,你还没有回答,但我将从一些事情开始。

所以我假设

1.)对于10篇文章,每篇文章都有一个独特的下载链接,

2)每个链接都有“gotocls”类

3)下载内容工作正常,这意味着我只需要在必要时将其隐藏/显示。4.)10个下载链接中的每一个都至少有一个公共类,从您的代码来看,公共类似乎是\'gotocls\'

所以我指出,使用\'[0]\' 在代码中获取元素。您指出,它对第一个下载链接非常有效,这是因为您只针对第一个链接使用[0],我没有测试,但我认为,您可以使用“[1]”访问第二个链接,因为它就是这样工作的。

HTML应该如下所示。

<a class="gotocls" data-click="0">0</a>
<a class="gotocls" data-click="0">0</a>
<a class="gotocls" data-click="0">0</a>
<a class="gotocls" data-click="0">0</a>
<a class="gotocls" data-click="0">0</a>
<a class="gotocls" data-click="0">0</a>

**请不要点击数据;0“;属性对于代码的运行是非常必要的,所以请将其添加到html中**

如果由于某些限制,您无法放置数据属性,那么请使用此JS,但我不建议JS在页面加载时添加属性化的数据,因为html似乎是更符合逻辑和效率的事情

$(document).ready(function() {

$(\'.gotocls\').each(function() {
     $(this).attr(\'data-click\', \'0\');
});
});

当你尝试所有的10次链接点击时,你的代码就不起作用了。因此,基于输入和HTML的缺乏,下面是我的方法,请尝试一下,并在我的答案的评论中告诉我,我认为这一方法应该有效。

 $(document).ready(function(){
   $(".gotocls").click(function() {
     count= $(this).attr("data-click");
     count ++;
       if(count==5){
                $(this).hide();
       }
       else{
            $(this).attr(\'data-click\', count);
       }
   });
  });

相关推荐

如何在WordPress中用AJAX请求更改PHP变量

我有一个带有选择框的html表单,我想根据用户的选择显示不同的数据。我真正需要做的就是根据选择在php中更改1个变量。我进行了一个外部API调用,返回数据并将其显示在html表中。我想根据用户的选择更改api调用的一小部分(get uri中的id)。有没有简单的方法可以做到这一点?我已经完成了jquery并使用wordpress将其排队,当更改select box值时,我得到了200个响应。但我似乎无法更改PHP。为了避免代码轰炸,我修改了回调函数,以给出一个我希望发生的示例。非常感谢您的反馈。谢谢HTM