javascript - 如何使用参数将函数附加到事件处理程序

Question

我正在用 jQuery 编写，希望在单击元素时发生一些事情。我想要调用的函数需要参数，并且必须始终监视该事件，因此处理程序位于 $(document).ready() 中。这就是我的意思:

"use strict"
$(document).ready(function(){
    $("<button>").each(
        $(this).click(doSomething)
    );    
});
function doSomething(message){
    alert(message);
}

问题是 doSomething 需要一条可以发出警报的消息。但是，如果我将代码更改为:

$(document).ready(function(){
    $("<button>").each(
        $(this).click(doSomething("Hello world"))
    );    
});
function doSomething(message){
    alert(message);
}

然后页面加载时会弹出“Hello world”提示，点击按钮不会执行任何操作。如何保持第一种方式的行为，但向方法传递参数？

Answer 1

您需要传递一个匿名函数，然后该函数使用所需的参数调用您的函数:

$(document).ready(function(){
    $("button").click(function() {
            doSomething("Hello world!");
        });
    );    
});
function doSomething(message){
    alert(message);
}

请注意，我已经修改了选择器，以便它选择现有的 <button>元素而不是创建一个新元素，并删除了不必要的 .each()自 .click()已经隐式迭代匹配的元素。