jquery单击处理程序多次触发

我有麻烦，我的saveBtn click事件会多次触发，因为下面的函数会被调用，并且每次用户调用该函数时都会注册一个新的click处理程序。如何仅注册一次单击事件处理程序

function forceAnnotation(annotationNo,objectNo,clientNo, callBack) {

     $('#forcedAnnotation').dialog( { 
        modal: true,
        width: 385,
        height: 370,
        closeOnEscape: false,
        open: function(event, ui) { jQuery('.ui-dialog-titlebar-close').hide(); }
     });

     $('#cancelBtn').click(function() {
        callBack.onCancel();
        $('#forcedAnnotation').dialog("close")
     });

     $('#saveBtn').click(function(){
             //make ajax call
     });

  }

---

最简单的方法是重构代码，删除

单击

处理程序注册到函数之外

如果不可能，可以在

forceAnnotation（）

函数的作用域之外声明cancel函数。在你的函数中，重新定义它为你所需要的

 var cancelClick = function(){};

 function forceAnnotation(annotationNo,objectNo,clientNo, callBack) {

   $('#forcedAnnotation').dialog( { 
    modal: true,
    width: 385,
    height: 370,
    closeOnEscape: false,
    open: function(event, ui) { jQuery('.ui-dialog-titlebar-close').hide(); }
   });

   cancelClick =  function(){
                  callBack.onCancel();
                  $('#forcedAnnotation').dialog("close");
                }
 }


 $('#cancelBtn').click(function() {
   cancelClick();
 });

 $('#saveBtn').click(function(){
         //make ajax call
 });

其他选择包括：

将处理程序附加到 元素。处理程序在以下位置执行： 每个元素最多一次

或者每次只需单击处理程序

 $('#cancelBtn').unbind("click").click(function() {
    callBack.onCancel();
    $('#forcedAnnotation').dialog("close")
 });

---

最简单的方法是重构代码，删除

单击

处理程序注册到函数之外

如果不可能，可以在

forceAnnotation（）

函数的作用域之外声明cancel函数。在你的函数中，重新定义它为你所需要的

 var cancelClick = function(){};

 function forceAnnotation(annotationNo,objectNo,clientNo, callBack) {

   $('#forcedAnnotation').dialog( { 
    modal: true,
    width: 385,
    height: 370,
    closeOnEscape: false,
    open: function(event, ui) { jQuery('.ui-dialog-titlebar-close').hide(); }
   });

   cancelClick =  function(){
                  callBack.onCancel();
                  $('#forcedAnnotation').dialog("close");
                }
 }


 $('#cancelBtn').click(function() {
   cancelClick();
 });

 $('#saveBtn').click(function(){
         //make ajax call
 });

其他选择包括：

将处理程序附加到 元素。处理程序在以下位置执行： 每个元素最多一次

或者每次只需单击处理程序

 $('#cancelBtn').unbind("click").click(function() {
    callBack.onCancel();
    $('#forcedAnnotation').dialog("close")
 });

---

如果您每次都被迫添加单击处理程序，为什么不每次都使用以下方法将其拆离：

$('#cancelBtn').unbind('click');

要确保只需取消绑定此特定的单击处理程序，可以使用名称空间

$('#cancelBtn').unbind('click.annotation').bind('click.annotation', function(e) {
  callBack.onCancel();
  $('#forcedAnnotation').dialog("close")
});

$('#saveBtn').unbind('click.annotation').bind('click.annotation', function(e) {
  //make ajax call
});

---

如果每次都要强制添加单击处理程序，为什么不每次都使用以下方法将其分离，我希望这会起作用：

$('#cancelBtn').unbind('click');

要确保只需取消绑定此特定的单击处理程序，可以使用名称空间

$('#cancelBtn').unbind('click.annotation').bind('click.annotation', function(e) {
  callBack.onCancel();
  $('#forcedAnnotation').dialog("close")
});

$('#saveBtn').unbind('click.annotation').bind('click.annotation', function(e) {
  //make ajax call
});

---

这应该行得通，我希望您可以使用jQuery.one（）函数

“将处理程序附加到元素的事件。每个元素最多执行一次处理程序。”

---

也许您可以使用jQuery.one（）函数

“将处理程序附加到元素的事件。每个元素最多执行一次处理程序。”

---

Thx，对于模态对话框，我也遇到了同样的问题。当我打开一个新对话框时，即使最后一个对话框已关闭，两个对话框上的单击事件仍处于活动状态，因此请使用one（）编辑技巧：

one（'click'）

，而不是

on（'click'）

。Thx，对于模式对话框，我遇到了相同的问题。当我打开一个新对话框时，即使最后一个对话框已关闭，两个对话框上的单击事件仍处于活动状态，因此请使用one（）编辑技巧：

one（'click'）

，而不是

on（'click'）

。