Question

通常，我通过编程方式将处理程序附加到DOM中的元素，这些元素依赖于稍后可能会更改的变量。

nextID = "#content-" + dataElement.elementBack;
something.on("change", function (e) {
    $(nextID).css({left: 0, position:'fixed', zindex: -1});
});

当触发此函数时，nextID的值已更改并作用于错误的元素。

有没有办法在函数首次定义或附加到事件时使用变量的当前值？

（请不要建议代替nextID，我在那里硬编码元素。如果我愿意，我可以。）

Answer 1

解决方法是使用自调用函数：

nextID = "#content-" + dataElement.elementBack;

(function(nextID) {
    something.on("change", function (e) {
        $(nextID).css({left: 0, position:'fixed', zindex: -1});
    });
})(nextID);

函数在JavaScript中创建新范围，并且由于您将nextID作为参数，nextID获得范围，并且在触发change事件时它将被捕获并可用。

这是因为除了函数之外，JavaScript不会为任何其他语言构造创建范围。例如，for for(var i = 0; i < 10; i++) {}不会创建范围，一旦循环结束，i在当前范围内可用，它将包含10。< / p>

我建议你看看下一版ECMA-Script（ECMA-Script 6）的let关键字部分，它将让我们创建块范围的变量。

Answer 2

您可以创建一个IIFE，它将nextID的初始值绑定到该函数处理程序。目前我们正在创建一个闭包，其中变量值的范围限定为内部返回函数。

nextID = "#content-" + dataElement.elementBack;
something.on("change", (function(nextID) { 
    return function (e) {
        $(nextID).css({left: 0, position:'fixed', zindex: -1});
       }
    })(nextID)
);

定义函数时如何捕获外部变量的当前值

2 个答案: