3

基本上我有一个“删除所选”按钮，只要没有选中复选框，它就会被禁用。一旦用户选中一个复选框，我想将一个点击事件处理程序绑定到这个按钮。

由于可能会发生用户取消选择复选框并且未选择任何复选框的情况，因此我想将完整的事件处理程序函数存储在一个变量中，并且仅在选中复选框后才绑定它。

问题是：如何将这个事件处理函数存储在一个变量中，以便最容易地将它绑定到一个对象？

到目前为止，我只使用它来取消绑定事件处理程序（已存在于该对象上），然后再次绑定它，如下所示：

$(my-selector).unbind('click', eventHandler);
$(my-selector).bind('click', eventHandler);

...但绝不会反过来。

4

4 回答 4

5

我的建议是走一条不同的路线：绑定事件并将它们绑定到页面的整个生命周期。在事件处理程序中，检查相关对象的状态并决定如何处理该事件——这可能包括简单地忽略它。

这背后有两个理由：

  • 保持简单和可调试
  • 我看到事件的传递延迟了很长时间，以至于事件开始时的状态与事件传递时的状态不再相同：即：您的事件在您解除绑定后已传递（因为它是在仍绑定时启动的)
于 2012-08-18T18:56:26.773 回答
4

我不确定我是否理解，但你的意思是这样的吗？

// eventHandler function
var eventHandler = function(event) {

   ... // do something

}

// bind eventHandler function to jQuery collection
$(my-selector).bind('click', eventHandler);
$(my-selector).unbind('click', eventHandler);
于 2012-08-18T18:56:10.410 回答
0 
var handlerFunc = function () {...}
$(my-selector).unbind('click', handlerFunc);
$(my-selector).bind('click', handlerFunc);
于 2012-08-18T18:56:22.147 回答
0

您可以使用变量来存储选中的复选框，如下所示：

var checkboxHandler = {}

checkboxHandler.activateButton = function(){...};
checkboxHandler.deactivateButton = function(){...};
checkboxHandler.checkboxes_checked = {};
checkboxHandler.number_of_checked_checkboxes = 0;
checkboxHandler.checkboxClicked = function(event){
    if($(this).attr('checked')){
        var id = $(this).attr('id');
        if(checkboxHandler.checkboxes_checked[id]){
            // uncheck
            checkboxHandler.checkboxes_checked[id] = false;
            checkboxHandler.number_of_checked_checkboxes--;
        }else{
            // checked
            checkboxHandler.checkboxes_checked[id] = true;
            checkboxHandler.number_of_checked_checkboxes++;
        }
        if(checkboxHandler.number_of_checked_checkboxes>0){
            checkboxHandler.activateButton();
        }else{
            checkboxHandler.deactivateButton();
        }
    }
}

$('checkboxes').bind('click',checkboxHandler.checkboxClicked)

这样，您只需绑定一次复选框，而不必绑定/取消绑定它们

于 2012-08-18T18:59:12.810 回答