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

<强>已更新

我正在搞乱其他人提出的一些事情，我认为这正是你需要完成的事情：

(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并取消选择.Fn而不是引用它们。

Answer 2

检查这是否适合您。还要确保jquery版本高于1.7，对于＆＃34; on＆＃34;，＆＃34; off＆＃34;工作。

(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 3

这样的事情：

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

Answer 4

为单击按钮添加一个类名，然后在单击一次后删除该类。

$('#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 5

这适用于动态创建的元素：

(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 6

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

if (btn1Clicked)
     return;
btn1Clicked=true;

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

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

6 个答案: