javascript - 将运行时参数值发送到 jQuery 的 ON 方法？

Question

我有一个简单的按钮。我需要在单击时将数据发送到处理程序。

所以我有这个代码使用ON 重载方法：

.on( events [, data ], handler(eventObject) )

我创建了这个示例：

var aaa="john";

function greet(event) { alert("Hello "+event.data.name); }

$("button").on("click", { name: aaa}, greet);

setTimeout(function (){aaa="paul"},2000)

但在等待 2 sec 后，我仍然看到： "Hello John"

所以我假设这个aaa值在解释时是有界的。

问题 ：

如何更改代码以便在 2 秒后发出警报：Hello Paul？

JSBIN

Answer 1

一种简单的方法是使用对象字面量。您可以将其作为事件数据传递并保留稍后修改的引用：

var greetData = {
    name: "john"
};

function greet(event)
{
    alert("Hello " + event.data.name);
}

$("button").on("click", greetData, greet);

setTimeout(function() {
    greetData.name = "paul";
}, 2000);

您将在此处找到更新的 JS Bin 。

Answer 2

Frédéric Hamidi 的回答更好。将把它作为一种选择。

如果您更改它以便传递一个加载名称而不是其自身名称的函数，它将起作用：

var aaa="john";

function getName() {
  return aaa;
}

function greet(event) { alert("Hello "+event.data.name()); }
$("button").on("click", { name: getName}, greet);

setTimeout(function (){aaa="paul";},2000);

http://jsbin.com/ohAJihi/4/edit

Answer 3

理解您要实现的目标有点令人困惑。如果您使用 setTimeout；无需使用按钮 onclick 处理程序。其次，setTimeout 函数的作用域始终是窗口对象。因此，如果您需要访问对象中的值，请创建它的引用并在 setTimeout 函数中使用。