0

考虑以下javascript：

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function runMe(){
 for(var x=0; x<5; x++){
  var d=document.createElement("DIV");
  d.innerHTML="test " + x;
  d.tabIndex=x;

  d.onfocus=function(y){
   return function(){
    alert("focus: " + y);
   }
  }(x);

  d.onblur=function(y){
   return function(){
    alert("blur: " + y);
   }
  }(x);

  document.body.appendChild(d);

 }
}
</script>
</head>
<body onload="runMe()">
</body>
</html>

运行时，onblur 事件会触发并提醒新聚焦的 div 的索引，而不是提醒先前聚焦的 div 的索引。

奇怪的是，当我注意到 onfocus 事件时，onblur 会按预期工作，提醒之前关注的 div。

我似乎无法找出为什么 onblur 事件会触发与 onfocus 事件相同的索引。

我相信我的关闭是正确的，但我不是 100% 的。

有人对我的错误有所了解吗？

4

1 回答 1

1

演示：http: //jsfiddle.net/abc123/nCwDz/1/

您的代码似乎对我有用...将警报更改为 console.log 请使用 Firefox 或 Chrome，然后转到控制台查看它是否正常工作。

为了证明您的闭包是正确的，我已将您的代码更改为适当缩进。

代码：

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript">
            function runMe(){
                for(var x=0; x<5; x++){
                    var d=document.createElement("DIV");
                    d.innerHTML="test " + x;
                    d.tabIndex=x;

                    d.onfocus=function(y){
                        return function(){
                            console.log("focus: " + y);
                        }
                    }(x);

                    d.onblur=function(y){
                        return function(){
                            console.log("blur: " + y);
                        }
                    }(x);

                    document.body.appendChild(d);
                }
            }
        </script>
    </head>
    <body onload="runMe()">
    </body>
</html>
于 2013-06-10T20:00:38.317 回答