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

Question

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

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 在绑定中被作为函数调用。换句话说，您将 click 事件绑定到调用的结果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...;
    ...;
}