Javascript for循环中的粘性/静态变量引用_Javascript_Jquery

Javascript for循环中的粘性/静态变量引用

javascript jquery

Javascript for循环中的粘性/静态变量引用,javascript,jquery,Javascript,Jquery,在本例中，我创建了三个按钮“一”“二”“三”。单击时，我希望他们提醒自己的号码： <html> <head> <script type="application/javascript" src="jquery.js"></script> <script type="application/javascript"> $(document).ready(function() {

在本例中，我创建了三个按钮“一”“二”“三”。单击时，我希望他们提醒自己的号码：

<html>
    <head>
        <script type="application/javascript" src="jquery.js"></script>
        <script type="application/javascript">
            $(document).ready(function() {
                var numbers = ['one', 'two', 'three'];
                for (i in numbers) {
                    var nr = numbers[i];
                    var li = $('<li>' + nr + '</li>');
                    li.click(function() {
                        var newVariable = String(nr);
                        alert(i); // 2
                        alert(nr); // three
                        alert(newVariable); // three
                        alert(li.html()); // three
                    });
                    $('ul').append(li);
                }
            });
        </script>
    </head>
    <body>
        <ul>
        </ul>
    </body>
</html>


$（文档）.ready（函数（）{
变量数=[‘一’、‘二’、‘三’]；
用于（i个数字）{
var nr=数字[i]；
var li=$（''+nr+''）；
li.单击（函数（）{
var newVariable=字符串（nr）；
警惕（i）；//2
警报（nr）；//三个
警报（newVariable）；//三个
警报（li.html（））；//三个
});
$（'ul'）。追加（li）；
}
});

问题是，当单击其中任何一个时，将使用循环变量的最后一个值，即警报框总是显示“三”

在JavaScript中，for循环中的变量在C语言意义上似乎是“静态”的是否有办法为每个单击函数创建单独的变量，即不使用相同的引用

谢谢

编辑：解决方案是将任意数据与每个元素关联：

<html>
    <head>
        <script type="application/javascript" src="jquery.js"></script>
        <script type="application/javascript">
            $(document).ready(function() {
                var numbers = ['one', 'two', 'three'];
                for (i in numbers) {
                    var nr = numbers[i];
                    var li = $('<li>' + nr + '</li>');
                    li.data('nr', nr);
                    li.click(function() {
                        alert($(this).data('nr'));
                    });
                    $('ul').append(li);
                }
            });
        </script>
    </head>
    <body>
        <ul>
        </ul>
    </body>
</html>


$（文档）.ready（函数（）{
变量数=[‘一’、‘二’、‘三’]；
用于（i个数字）{
var nr=数字[i]；
var li=$（''+nr+''）；
li.数据（'nr'，nr）；
li.单击（函数（）{
警报（$（this.data（'nr'））；
});
$（'ul'）。追加（li）；
}
});

您需要在元素或上附加任何数据，以便以后重用

e、 g

。。。
var li=$（''+nr+''）；
数据（li，“值”，foo）；
li.单击（函数（）{
var foo=jQuery.data（li，“值”）；
...
}

您需要在元素或上附加任何数据，以便以后重用

e、 g

。。。
var li=$（''+nr+''）；
数据（li，“值”，foo）；
li.单击（函数（）{
var foo=jQuery.data（li，“值”）；
...
}

这是正常工作的，您要求单击事件使用这些变量（不是绝对值），在调用该方法时，变量处于其“最大”值

尝试使用title属性存储要返回的值，即：

var li = $('<li title="' + nr + '">' + nr + '</li>');

未经测试，但这应该有效，或者至少将您设置在正确的轨道上。

这是正常的，您要求单击事件使用这些变量（不是绝对值），并且在调用该方法时，变量处于其“最大”值

尝试使用title属性存储要返回的值，即：

var li = $('<li title="' + nr + '">' + nr + '</li>');

未测试，但这应该可以工作，或者至少让您走上正确的轨道。

或者，在for循环内放置一个闭包

        $(document).ready(function() {
            var numbers = ['one', 'two', 'three'];
            for (i in numbers) {
                (function () {
                var nr = numbers[i];
                var li = $('<li>' + nr + '</li>');

                li.click(function() {
                    var newVariable = String(nr);
                    alert(i); // 2
                    alert(nr); // three
                    alert(newVariable); // three
                    alert(li.html()); // three
                });

                $('ul').append(li);

                }());
            }
        });

$（文档）.ready（函数（）{
变量数=[‘一’、‘二’、‘三’]；
用于（i个数字）{
（功能（）{
var nr=数字[i]；
var li=$（''+nr+''）；
li.单击（函数（）{
var newVariable=字符串（nr）；
警惕（i）；//2
警报（nr）；//三个
警报（newVariable）；//三个
警报（li.html（））；//三个
});
$（'ul'）。追加（li）；
}());
}
});

在中使用

for对数组进行迭代也是不好的做法。它应该严格用于对对象字段进行迭代。请改用for（；；；）
。
或者，在for循环中放置一个闭包
        $(document).ready(function() {
            var numbers = ['one', 'two', 'three'];
            for (i in numbers) {
                (function () {
                var nr = numbers[i];
                var li = $('<li>' + nr + '</li>');

                li.click(function() {
                    var newVariable = String(nr);
                    alert(i); // 2
                    alert(nr); // three
                    alert(newVariable); // three
                    alert(li.html()); // three
                });

                $('ul').append(li);

                }());
            }
        });

$（文档）.ready（函数（）{
变量数=[‘一’、‘二’、‘三’]；
用于（i个数字）{
（功能（）{
var nr=数字[i]；
var li=$（''+nr+''）；
li.单击（函数（）{
var newVariable=字符串（nr）；
警惕（i）；//2
警报（nr）；//三个
警报（newVariable）；//三个
警报（li.html（））；//三个
});
$（'ul'）。追加（li）；
}());
}
});

在

中使用

for对数组进行迭代也是不好的做法。它应该严格用于对对象字段进行迭代。使用for（；；）
取而代之。
是的，这解决了问题！jQuery文档指出您应该使用li.data来代替。我已经为问题添加了解决方案。谢谢！是的，这解决了问题！jQuery文档指出您应该使用li.data来代替。我已经为问题添加了解决方案。谢谢！谢谢您的提示，但在我的实际使用案例中我有一个相当大的JSON结构，我想与每个按钮相关联。我编辑了这个问题来展示我是如何解决它的。谢谢你的提示，但在我的实际用例中，我有一个相当大的JSON结构，我想与每个按钮相关联。我编辑了这个问题来展示我是如何解决它的。