点击后立即删除点击事件处理程序

Question

我一直试图删除点击事件处理程序后点击一次，以防止事件多次发射。

我试过.unbind().off().one()并把每个在功能的各个不同的地方，但似乎没有工作。

如果我使用.off()，我得到一个undefined is not a function错误。

如果我使用.one()如果我点击另一个按钮，我想基本上打开事件。所以如果我点击选择，我希望它只触发一次，但如果我然后点击取消选择，我想选择再次点击。

我试过做下面的事，但奇怪的代码甚至没有触发，所以我一直被迫使用click()。

$().on('click', function()... 

我应该使用哪个函数，应该在哪里放？

(function($) { 

Drupal.behaviors.wysiwyg = { 
    attach: function(context, settings) { 

     var toggle = function(state) { 
      $('#wysiwyg-profile-form .buttons-and-plugins input:checkbox').attr('checked', state); 
     } 

     $('#wysiwyg-select-all').click(function(){ 
    toggle(true); 
      return false; 
     }); 

     $('#wysiwyg-unselect-all').click(function(){ 
    toggle(false); 
      return false; 
     }); 
    } 
} 

}(jQuery)) 

Answer 1

检查是否适用于您。还要确保jquery版本在“开”，“关”工作时高于1.7。

(function($) { 

    Drupal.behaviors.wysiwyg = { 
    attach: function(context, settings) { 
    var counter = 0; 
     var toggle = function(state) { 
     $('#wysiwyg-profile-form .buttons-and-plugins input:checkbox').attr('checked', state); 
     } 

     $(document).off('click',"#wysiwyg-select-all").on('click', "#wysiwyg-select-all", function(e) { 
     toggle(true);    
     return false; 
     }); 

     $(document).off('click',"#wysiwyg-unselect-all").on('click', "#wysiwyg-unselect-all", function(e) { 
     toggle(false);  
     return false; 
     }); 
    } 
    } 

}(jQuery)) 

Answer 2

事情是这样的：

$("#wysiwyg-select-all").one("click", function() { 
    toggle(true); 
    return false; 
}); 

Answer 3

添加一个类名点击按钮，然后删除类一旦其点击一次。

$('#wysiwyg-select-all .myclassname').on('click', function(){ 
    toggle(true); 
    $(this).removeClass('myclassname'); 
    $('#wysiwyg-unselect-all').addClass('secondclassname'); 
    return false; 
}); 

$('#wysiwyg-unselect-all .secondclassname').on('click', function(){ 
    toggle(false); 
    $('#wysiwyg-select-all').addClass('myclassname'); 
    $(this).removeClass('secondclassname'); 
    return false; 
}); 

Answer 4

这应该用于动态创建的元素工作：

(function ($) { 

    Drupal.behaviors.wysiwyg = { 
     attach: function (context, settings) { 

      var toggle = function (state) { 
       $('#wysiwyg-profile-form .buttons-and-plugins input:checkbox').attr('checked', state); 
      }; 

      $(document).on("click", "#wysiwyg-select-all", selectFn()); 
      $(document).on("click", "#wysiwyg-unselect-all", unselectFn()); 
     } 
    }; 

}(jQuery)); 


function selectFn() { 
    $(document).off("click", '#wysiwyg-select-all', "**"); 
    $(document).on("click", "#wysiwyg-unselect-all", unselectFn()); 
    toggle(true); 
    return false; 
} 

function unselectFn() { 
    $(document).off("click", '#wysiwyg-unselect-all', "**"); 
    $(document).on("click", "#wysiwyg-select-all", selectFn()); 
    toggle(false); 
    return false; 
} 

Answer 5

修订

我与几个其他这些家伙们暗示的东西乱搞，我认为这正是你需要做什么：

(function ($) { 

    Drupal.behaviors.wysiwyg = { 
     attach: function (context, settings) { 

      var selectFn = function() { 
       toggle(true); 
       return false; 
      } 

      var unselectFn = function() { 
       toggle(false); 
       return false; 
      }  

      var toggle = function (state) { 
       $('#wysiwyg-profile-form .buttons-and-plugins input:checkbox').attr('checked', state); 
       if (state) { 
        $(document).off("click", '#wysiwyg-select-all,#wysiwyg-unselect-all', "**"); 
        $(document).on("click", "#wysiwyg-unselect-all", unselectFn; 
       }else{ 
        $(document).off("click", '#wysiwyg-select-all,#wysiwyg-unselect-all', "**"); 
        $(document).on("click", "#wysiwyg-select-all", selectFn; 
       } 
      }; 

      $(document).on("click", "#wysiwyg-select-all", selectFn); 
      $(document).on("click", "#wysiwyg-unselect-all", unselectFn); 

     } 
    }; 

}(jQuery)); 

它切换按钮事件的绑定，并将与动态创建的元素一起使用。这是Matt Green的答案的一个衍生物，但我注意到他的几个问题，即他在事件绑定中调用selectFn和unselectFn而不是引用它们。

Answer 6

为什么不使用任何全局变量作为标志。点击事件设置为true。

if (btn1Clicked) 
    return; 
btn1Clicked=true; 

并重新启用只是将其设置为false。 如果需要，您可以使用return false而不是return。