4

HTML

<body>
    <div id='test' onClick="load()">
       2
    </div>
</body>

Javascript

load = function() {
  test.innerHTML = "";

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

        var p = document.createElement("p");
        p.innerHTML = "Link";

        p.onclick = function () {
            alert("LINK NR: " + i)
        }

        document.getElementById('test').appendChild(p);

    }
}

在上面的代码中，为什么函数总是返回最后一个value？

这是代码的小提琴。

4

4 回答 4

5

p.onclick只有在元素上触发了“click”事件时才会调用该函数，届时该函数的值i将是 5，因为此时循环已经完成执行。

您期望函数语句将为每个循环迭代执行 - 事实并非如此。如果它确实被执行了，那么对于每次迭代，您都会收到一条警告消息，而不管元素是否被单击。

这可以通过保持console.log函数外部和内部来检查，您会发现对于每次迭代，console.log函数外部的语句将打印在浏览器的控制台中，但console.log函数内部的语句不会在循环的每次迭代中执行。

于 2013-08-30T12:14:40.397 回答
1

尝试这个：

    (function(i){
        p.onclick = function () {
            alert("LINK NR: " + i)
        }
    })(i);

小提琴：http: //jsfiddle.net/sFXep/2/

这是解释：http ://en.wikipedia.org/wiki/Immediately-invoked_function_expression

在这里：http ://benalman.com/news/2010/11/immediately-invoked-function-expression/

于 2013-08-30T12:13:12.233 回答
1 
check this  fiddle  link i have made some small changes

http://jsfiddle.net/sFXep/8/

于 2013-08-30T12:18:04.430 回答
1

一旦for语句完全执行，局部变量 i就具有 value 5。
并且在所有创建的事件处理程序中，与 for 循环中的最终i值相同i

于 2013-08-30T12:23:54.000 回答