在for循环内生成.click函数

时间:2018-10-04 07:34:13

标签: javascript loops

在我的for循环中,该循环遍历15个“盒子”对象,代码如下:

for (var i = 0; i < boxesLength; i++) {

我试图自动生成这些点击事件,它们过去是这样的:(一直到15个)

$("#box0").click(function(){
    var rw = 462;
    var input = $('#rw');
    input.val(rw);

    var rh = 310;
    var input = $('#rh');
    input.val(rh);
    calculateRectangle();
    calculateRectangle2();
});

现在,我正在尝试通过以下操作在for循环中自动生成这些代码:

$("#box" + i).click(function(){
    var rw = allBoxes[i].width;
    var input = $('#rw');
    input.val(rw);

    var rh = allBoxes[i].length;
    var input = $('#rh');
    input.val(rh);
    calculateRectangle();
    calculateRectangle2();
});

我在做什么错?当我使用控制台日志“ #box” +我获得预期的结果。

2 个答案:

答案 0 :(得分:1)

这是closures的示例。当您尝试单击一个按钮时,算法将使用i变量的最后一个值boxesLength

要解决此问题,只需使用let关键字。

for (let i = 0; i < boxesLength; i++) {
     ^^^

答案 1 :(得分:0)

另一个解决方案是这样的:

$("#box" + i).click(function(i){
return function(){
    var rw = allBoxes[i].width;
    var input = $('#rw');
    input.val(rw);

    var rh = allBoxes[i].length;
    var input = $('#rh');
    input.val(rh);
    calculateRectangle();
    calculateRectangle2();
}}(i));