Jquery 创建 "array"的 .click 函数

Question

我有一组 div:

<div id="div_01">ASD</div>
<div id="div_02">ASD</div>
<div id="div_03">ASD</div>

我想为这些 div 创建一组 .click 函数:

我尝试过这个:

    for (var i = 1; i < 4; i++) {
        var picName = "#BSViolenceDiv_0" + i.toString();
        //alert("\nI have for i: " + i + ": " + picName);
        $("#div_0" + i.toString()).click(function(){
             $("#div_0" + i.toString()).animate({opacity:1}, 1000);
         });    
    }

它不起作用，因为我最终变成了 3。

我做错了什么？

Answer 1

如果您可以使用全局类(例如 my_div)来代替，那就更好了:

<div id="div_01" class="my_div">ASD</div>
<div id="div_02" class="my_div">ASD</div>
<div id="div_03" class="my_div">ASD</div>

然后将 click 事件附加到此类，这样您就不需要循环遍历所有 div 的:

$(".my_div").click(function(){
    $(this).animate({opacity:1}, 1000); // "$(this)" refer to the clicked div
})

希望这有帮助。

$(".my_div").click(function(){
  $(this).animate({opacity:1}, 1000);
})

.my_div{
  opacity: 0.3;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div_01" class="my_div">ASD</div>
<div id="div_02" class="my_div">ASD</div>
<div id="div_03" class="my_div">ASD</div>