jQuery 事件队列调整方法


Posted in Javascript onSeptember 18, 2009

大家都发现,通过jQuery绑定事件是件非常容易的事情

<TEXTAREA class=javascript name=code rows=15 cols=50>$("a").click(function(){ 
    console.info("A"); 
    return false; 
}); 
</TEXTAREA>

但是A事件绑定后,我发现我需要B事件来决定其是否触发,好办,现在就改。
<TEXTAREA class=javascript name=code rows=15 cols=50>$("a").click(function(){ 
    console.info("B"); 
    return false; 
}); 
$("a").click(function(){ 
    console.info("A"); 
    return false; 
}); 
</TEXTAREA>

真的能够阻止后面的click事件触发吗?事与愿违。
如果B事件需要通过异步调用来判断A事件是否需要触发呢?
<TEXTAREA class=javascript name=code rows=15 cols=50>$("a").click(function(){ 
    $.ajax({ 
        url:"b.html", 
        success:function(msg){ 
            if(msg){ 
                console.info("pass"); 
                return true; 
            }else{ 
                console.info("nopass"); 
                return false; 
            } 
        } 
    }); 
}); 
$("a").click(function(){ 
    console.info("B"); 
    return false; 
}); 
</TEXTAREA>

事实发现根本不可能,那怎么办呢?
先说几种思路:
将后绑定的事件通过另外一种触发,比如A事件是绑定在click上,那么B事件绑定在mouseover上,先触发mouseover再通过它来阻止click事件。(后来经过研究,发现这几乎是不可能的事情)
将2个事件通过jquery的queue进行处理。(这个确实可以解决先后触发的问题,但是现实的情况是项目中所有的事件绑定已经全部写好,目前需要每个按钮事件前都加上1个判断的AJAX请求。要不就是所有的按钮事件全部重写,要么另外寻找一条路)
深入jQuery的事件机制,获得其事件的队列,针对其事件队列进行处理。
<TEXTAREA class=javascript name=code rows=15 cols=50>//我们先让其默认绑定个事件,称其为A事件 
$("a").click(function(){ 
    console.info(1); 
    return false; 
}); 
//现在我们要让后面绑定的B事件先触发,并且控制A事件是否触发 
//获取对象a绑定的事件对象中的click事件 
var event = $("a").data("events").click; 
//因为这个a在我们的B事件中也需要用到,为了防止this对象的改变,因此特地声明变量that保存 
var that = $("a"); 
//下面就是B事件了,但是貌似好像没有绑定啊 
var B = function(){ 
    $.ajax({ 
        url:"b.html", 
        success:function(msg){ 
            if(msg){ 
                console.info("pass"); 
                tt.call(that); 
            }else{ 
                console.info("nopass"); 
            } 
        } 
    }); 
return false; 
}; 
//关键对象,尽请对其多关注 
var tt; 
//关键代码,尽请多关注 
for(var i in event){ 
    tt = event[i]; 
    event[i] = B;//如果注释此行,下面2行必须取消注释。效果一样,原理不同... 
//delete(event[i]); 
    //that.click(B); 
    break; 
} 
</TEXTAREA>

问题貌似圆满解决,但是AJAX的callback函数中的return,是否可以抓的到呢?
Javascript 相关文章推荐
在第一个input框内输入内容.textarea自动得到第一个文件框的值的javascript代码
Apr 20 Javascript
jQuery 加上最后自己的验证
Nov 04 Javascript
扩展Jquery插件处理mouseover时内部有子元素时发生样式闪烁
Dec 08 Javascript
js对象关系图 方便dom操作
Mar 18 Javascript
解析js中获得父窗口链接getParent方法以及各种打开窗口的方法
Jun 19 Javascript
鼠标滚轮改变图片大小的示例代码
Nov 20 Javascript
javascript闭包入门示例
Apr 30 Javascript
在微信、支付宝、百度钱包实现点击返回按钮关闭当前页面和窗口的方法
Aug 05 Javascript
原生js实现返回顶部缓冲效果
Jan 18 Javascript
js实现股票实时刷新数据案例
May 14 Javascript
静态页面实现 include 引入公用代码的示例
Sep 25 Javascript
微信小程序中button组件的边框设置的实例详解
Sep 27 Javascript
javascript 面向对象编程  function是方法(函数)
Sep 17 #Javascript
javascript 面向对象编程 聊聊对象的事
Sep 17 #Javascript
javascript 面向对象编程 万物皆对象
Sep 17 #Javascript
javascript 面向对象编程 function也是类
Sep 17 #Javascript
类似CSDN图片切换效果脚本
Sep 17 #Javascript
var与Javascript变量隐式声明
Sep 17 #Javascript
html数组字符串拼接的最快方法
Sep 16 #Javascript
You might like
Terran热键控制
2020/03/14 星际争霸
超小PHP小马小结(方便查找后门的朋友)
2012/05/05 PHP
PhpDocumentor 2安装以及生成API文档的方法
2014/05/21 PHP
PHP学习笔记之字符串编码的转换和判断
2014/05/22 PHP
php bootstrap实现简单登录
2016/03/08 PHP
laravel添加前台跳转成功页面示例
2019/10/22 PHP
纯js实现的论坛常用的运行代码的效果
2008/07/15 Javascript
关于捕获用户何时点击window.onbeforeunload的取消事件
2011/03/06 Javascript
基于jquery的无刷新分页技术
2011/06/11 Javascript
js判断浏览器类型为ie6时不执行
2014/06/15 Javascript
Javascript 实现图片无缝滚动
2014/12/19 Javascript
解析javascript中鼠标滚轮事件
2015/05/26 Javascript
jQuery.uploadify文件上传组件实例讲解
2016/09/23 Javascript
详解微信小程序入门五: wxml文件引用、模版、生命周期
2017/01/20 Javascript
JS+HTML5 FileReader实现文件上传前本地预览功能
2020/03/27 Javascript
node.js基于express使用websocket的方法
2017/11/09 Javascript
基于Vue2的独立构建与运行时构建的差别(详解)
2017/12/06 Javascript
vue中进行微博分享的实例讲解
2019/10/14 Javascript
urllib2自定义opener详解
2014/02/07 Python
python中使用pyhook实现键盘监控的例子
2014/07/18 Python
python使用分治法实现求解最大值的方法
2015/05/12 Python
python定时执行指定函数的方法
2015/05/27 Python
Python实现的微信公众号群发图片与文本消息功能实例详解
2017/06/30 Python
python安装numpy&amp;安装matplotlib&amp; scipy的教程
2017/11/02 Python
python数据封装json格式数据
2018/03/04 Python
Python网络编程使用select实现socket全双工异步通信功能示例
2018/04/09 Python
在Python函数中输入任意数量参数的实例
2019/07/16 Python
详解Python文件修改的两种方式
2019/08/22 Python
python多进程并行代码实例
2019/09/30 Python
Django关于admin的使用技巧和知识点
2020/02/10 Python
Mio Skincare中文官网:肌肤和身体护理
2016/10/26 全球购物
实习医生自我评价
2013/09/22 职场文书
歌唱比赛主持词
2014/03/18 职场文书
介绍信如何写
2015/01/31 职场文书
公司年会晚会开幕词
2019/04/02 职场文书
python机器学习Github已达8.9Kstars模型解释器LIME
2021/11/23 Python