onclick函数不会在javascript for循环中重复

时间:2015-06-19 03:43:52

标签: javascript jquery

我想为n-numner次动态重复一个jquery函数。警报适用于计数,但功能不会多次创建。 我的代码如下

        var count = 5;
        var i = 1;
        for (var i = 1; i <= count; i++)
        {
            var min = ".min" + i;
            alert(min); // Just for testing purpose, working good
            document.writeln(min); // Just for testing purpose, working good
            alert(i); // Just for testing purpose, working good

            // Following function does not get repeated, 
            $(document).ready(function () {
                $("min" + i).click(function () {
                    alert(i);
                });
            });
        }

我的身体部分代码如下

 <div class="min1"> Test - 1 </div>
 <div class="min2"> Test - 2 </div>
 <div class="min3"> Test - 3 </div>
 <div class="min4"> Test - 4 </div>

这可能看起来很简单,但我需要某人的指导来完成它。请帮我把它搞定。这只是我将在我的项目中大量实施的概念。提前谢谢。

1 个答案:

答案 0 :(得分:3)

虽然代码中的问题是错误地使用了closure in a loop

解决方案可以不同,您可以对所有元素使用公共点击处理程序,然后使用data-*属性存储点击处理程序中所需的动态值。

$(document).ready(function() {
  $(".min").click(function() {
    alert($(this).data('id'));
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="min1 min" data-id="1">Test - 1</div>
<div class="min2 min" data-id="2">Test - 2</div>
<div class="min3 min" data-id="3">Test - 3</div>
<div class="min4 min" data-id="4">Test - 4</div>