高效的方式来编写多个jquery函数

Question

我有多个div,我必须为每个div编写这样的代码,并让php通过循环$ NBR ++来改变id; 在末尾.有没有更快的方法来写这一次,而不是每个div都有这个独特的？

   // when $NBR = 1
   <div class="playbutton<?php echo $NBR?>">
       <script>
           $(".playbutton<?php echo $NBR?>").click(function()
              {  $(".playbutton<?php echo $NBR?>").hide();
                 $('#songpicture').attr("src", "<?php echo $thumb[$NBR]?>");
              });
       </script>
   </div>


   // when $NBR = 2
   <div class="playbutton<?php echo $NBR?>">
       <script>
           $(".playbutton<?php echo $NBR?>").click(function()
              {  $(".playbutton<?php echo $NBR?>").hide();
                 $('#songpicture').attr("src", "<?php echo $thumb[$NBR]?>");
              });
       </script>
   </div>

这持续15次......等.....所有的PHP变量都是用PHP设置在每个div的开头.

那么有没有一种方法可以将其"压缩"为一个可以写一次的代码？或者必须在每个div之后写出？

谢谢你的帮助!

Answer 1

将其添加到顶部并删除所有其他脚本,

 <script>
  $(function () {
     $(".playback_divs").click(function() {  
       $(this).hide();
       $('#songpicture').attr("src", $(this).data('thumb-nbr'));
     });
  }
 </script>

并将您的HTML更改为,

<div class="playback_divs playbutton<?php echo $NBR?>" data-thumb-nbr="<?php echo $thumb[$NBR]?>">

注意html的变化

1)新类playback_divs添加到div.

2)数据attr data-thumb-nbr.