带参数的 jQuery 绑定和取消绑定事件

Question

我正在尝试将事件绑定到包含参数的文本框。下面的 keep 看起来好像应该这样做，但每次页面加载时，它都会被执行。

jQuery(function(){
    jQuery('#textbox').bind('click', EventWithParam('param'));
});

每次加载页面时都会使用该参数调用该事件。这可能不起作用，因为不支持带参数的事件。如果是的话，还有其他路线吗？

Answer 1

您可以将事件参数作为第二个参数传递给bind()。它不是直接回调参数，但也许您想使用它：

来自 jQuery 文档：
绑定

function handler(event) {
    alert(event.data.foo);
}  
$("p").bind("click", {foo: "bar"}, handler)

Answer 2

要绑定接受参数的函数，请使用匿名函数作为参数的闭包。

jQuery(function($) {
    var param = 'text';
    $('#textbox').click(function() {
        EventWithParam(param);
        // or just use it without calling out to another function
        $(this).text(param);
    });
});

您的示例正在执行 EventWithParam 函数，然后尝试绑定到该函数调用的结果。

调用 unbind 而不指定函数将取消绑定指定类型的所有处理程序事件（包括匿名函数）。如果您想专门取消绑定该函数，则需要为其提供一个名称，如下所示：

jQuery(function($) {
    var param = 'text',
        clickCallback = function() {
            EventWithParam(param);
            // or just use it without calling out to another function
            $(this).text(param);
        };
    $('#textbox').click(clickCallback);
});

Answer 3

bdukes 是完全正确的。我添加我的响应是因为我最近发现了一些与 jQuery 的绑定/取消绑定函数和匿名函数及其事件名称空间有关的有趣内容。如上所示，绑定事件的调用方式如下。

jQuery('#textbox').bind('click',function(){EventWithParam('param')});

要取消绑定，即使用户也必须调用 ...
jQuery('#textbox').unbind('click');

实际上，删除所有 onClick 事件。

现在出现在 jQuery 命名空间中。如果您有一个匿名函数，您希望附加到单击事件并稍后取消绑定，请按如下操作。

jQuery('#textbox').bind('click.yourNameSpace',function(){EventWithParam('param')});

然后要解除绑定，只需调用解除绑定函数，如下所示。

jQuery('#textbox').unbind('click.yourNameSpace');

其余的 onClick 事件将保留。

Answer 4

原因是 EventWithParam 在绑定中作为函数被调用。换句话说，您将点击事件绑定到调用 EventWithParam('param') 的结果。这应该可行：

jQuery('#textbox').bind('click',function(){EventWithParam('param')});

现在您已将 Even 绑定到一个函数，当事件触发时，该函数将调用 EventWithParam('param')

Answer 5

jQuery(function() {
    jQuery('#textbox').click(function() {
        EventWithParam(param1,param2,...,paramN);
    });
});

function EventWithParam(param1,param2,...,paramN) {
    doSomething...;
    ...;
}