javascript - For 循环函数，意外的输出 - 始终相同

Question

我遇到了这种奇怪的情况，我不知道为什么输出不是我所期望的。这只是一个简单的for循环函数。有人可以解释一下为什么会发生这种情况吗？

var pm = 2; 
for (var i = 0; i < pm; i++) {
     $("#specialty_pm_"+i).mouseenter(function(){
            alert(i);
    });
};

我的 html 中有 2 个 div，其中有 id="specialty_pm_<?php echo $countPM; ?>"该 div 位于 php 中的 for 循环函数内。 foreach ($employee_info as $emp_info){ $countPM++; } 我希望第一个 div 中的悬停警报为“1”，第二个 div 中的警报为“2”。但是当我将鼠标悬停在第一个 div 时，它会提醒“2”。

Answer 1

你应该使用 JavaScript 闭包:

var pm = 2; 
for (var i = 0; i < pm; i++) {
    var func = (function(i){
        return function(){
            alert(i);
        }
    })(i);
    $("#specialty_pm_"+i).mouseenter(func);
};

重点是在您的代码中，所有 mouseenter 函数都使用相同的变量 i，并且在循环结束后，它的最后一个值是 2。使用作用域链以及 JavaScript 中的嵌套函数及其闭包，您可以为变量创建安全作用域。基本上，嵌套函数的作用是为内部函数提供外部词法环境。您可以在这篇文章中找到更多信息:

Scope Chain in Javascript .