【问题标题】:jQuery Multiple Event Handlers - How to Cancel?jQuery 多事件处理程序 - 如何取消?
【发布时间】:2010-10-13 17:48:52
【问题描述】:

我有两个函数在两个不同的时间绑定到一个点击事件(使用 jQuery)。他们被解雇的顺序很重要。他们以正确的顺序开火。问题是,当第一个函数返回 false 时,第二个函数仍在触发!

如何正确取消活动?

示例代码:

$(document).click(function() { 
  alert('a');
  return false;
});

$(document).click(function() {
  alert('b');
});

单击页面时,您仍会看到“b”警告消息。这是不可接受的!

【问题讨论】:

    标签: jquery event-handling jquery-events


    【解决方案1】:

    使用解除绑定有帮助吗?

    $(document).click(function() { 
      alert('a');
      $(this).unbind('click');
      return false;
    });
    

    【讨论】:

    • 当第一个函数不返回 false 时,我仍然需要触发第二个事件。不会按字面意思“解绑”吗?
    • 你可以将我的解决方案与 nickf 解决方案合并,你会得到你的行为:)
    • unbind的问题是其他绑定的函数会触发失败。
    • 整个方法似乎是一种俗气的解决方法!我需要一种简单的方法来取消活动,仅此而已。在常规 Javascript 中,返回意味着返回,无论是真还是假。在 jQuery 中似乎不一样。必须有一种方法可以使用 jQuery 模拟“返回”功能。
    • jquery 是 javascript :p,它只是一个库,而不是一门新语言
    【解决方案2】:

    如果 nickf 说的不起作用,您可以使用小型状态机:

    var trigger = 0;
    
    $(document).click(function() { 
    
      alert('a');
      if(you_want_to_return_false) {
        trigger = 1;
        return false;
      }
    });
    
    $(document).click(function() {
      if(trigger !== 0) {
      alert('b');
      } 
      trigger = 0;
    });
    

    不是最漂亮的解决方案,但它会起作用。

    【讨论】:

    • 好吧,我的想法有效,只是它同时打破了它。为这个想法 +1。
    • 这种方法的破坏方式与另一种方法完全相同,只是代码更多。如果我错了,请纠正我。
    【解决方案3】:

    我要问的第一件事是:为什么你有两个函数绑定到同一个点击事件?可以访问代码,为什么不直接调用一次呢?

    $(function (){
        var callbackOne = function(e){
            alert("I'm the first callback... Warning, I might return false!");
            return false;
        };
    
        var callbackTwo = function(e){
            alert("I'm the second callback");
        };
    
        $(document).click(function (e){
            if(callbackOne(e)){
                callbackTwo(e);
            }
        });
    });
    

    【讨论】:

    • 组织。这个应用程序中有大量的 Javascript 代码,它被分成几个文件。这样,每个页面只下载必要的内容,从而加快加载时间。我有一个 HTTP 处理程序,它也可以组合、压缩和缓存它们,因此它们都可以在一个请求中获取。
    • 好的。那么真的需要-1吗?只是想提供帮助...您的解释足以让我们都知道这不是适合您的解决方案。
    • 对不起! :) 不知道谁愿意通过否决其他人可能的有效答案来浪费他的声誉......
    • +1。我已经回答了很多问题,问“你为什么要这样而不是那样做?”有时提问者不知道或忘记考虑其他选项。
    【解决方案4】:

    使用 jQuery 事件对象的stopImmediatePropagation 函数。

    阻止其余的处理程序被执行。 此方法还通过调用 event.stopPropagation() 来停止冒泡。

    $(document).click(function(event) { 
      alert('a');
      event.stopImmediatePropagation();
      return false;
    });
    
    $(document).click(function() {
      alert('b');
    });
    

    【讨论】:

    • 您可能需要注意,您需要使用 jQuery 1.3 及更高版本才能使用此功能。
    • 怎么样 $(document).on("touchstart click", ".myelement", function(e) {e.stopImmediatePropagtion(); //在这里运行函数})...如果touchstart 首先在平板设备上触发,如果我一直按住手指,它会取消点击触发吗?
    【解决方案5】:

    谢谢,取消绑定可以重新定义函数。

      $(document).ready(function(){
            $("#buscar_mercaderia").click(function(){ alert('Seleccione Tipo de mercaderia'); 
       });
    $(".tipo").live('click',function(){
                if($(this).attr('checked')!=''){
                    if($(this).val()=='libro'){
                        $("#buscar_mercaderia").unbind('click');
                        $("#buscar_mercaderia").click(function(){  window.open('buscar_libro.php','Buscar Libros', 'width=800,height=500'); });
                    }else if($(this).val()=='otra'){
                        $("#buscar_mercaderia").unbind('click');
                        $("#buscar_mercaderia").click(function(){ window.open('buscar_mercaderia.php','Buscar Mercaderias', 'width=800,height=500');  });
                    }
                }
            })
    

    【讨论】:

      【解决方案6】:

      另一种解决方案是去抖动或限制函数。

      通过这种方式,您可以确保尽管它多次触发,但它只在设定的持续时间内执行。这将允许您的代码按原样工作。

      【讨论】:

        猜你喜欢
        • 2010-10-22
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2016-08-30
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多