我知道这有效:
$("#btn_1").click(function() {
alert("Btn 1 Clicked");
});
虽然这只是过早弹出警报对话框:
$("#btn_1").click(alert("Btn 1 Clicked"););
我的问题是:在第二种情况下,为什么警报不等待点击再执行?
最佳答案
因为当您调用函数时,参数会立即执行以提供要传递给函数的参数。
func(arg);
相当于:
var temp = arg;
func(temp);
所以当你写:
$("#btn_1").click(alert("Btn 1 Clicked"));
它相当于:
var temp = alert("Btn 1 Clicked");
$("#btn_1").click(temp);
很明显,在这种形式中,警报发生在调用 .click()
为事件添加监听器之前。
为了延迟操作,您必须提供一个函数作为参数。函数定义本身不会导致任何代码被执行,它只会在稍后被调用时执行(这称为“回调”)。
它不一定是匿名函数,您也可以命名它。
function myAlert() {
alert("Btn 1 Clicked");
}
$("#btn_1").click(myAlert);
但请注意,您只是提供函数名称作为 .click()
的参数,而不是编写 myAlert()
,因为这会调用立即执行,不会延迟到点击事件发生。
正如 @Titus 所说,click()
期望其参数是一个函数,因为它希望将其作为回调执行。但你可以调用另一个函数来返回一个函数:
function alerter(message) {
return function() {
alert(message);
}
}
$("#btn_1").click(alerter("Btn 1 Clicked"));
请注意,alerter()
不会直接调用 alert()
,它返回另一个函数,该函数在调用时会调用 alert()
叫做。如上所述,直到点击事件执行其回调后才会发生这种情况。
关于javascript - 寻求令人满意的解释为什么回调中需要匿名函数包装器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39009377/