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 相关文章推荐
js+css使DIV始终居于屏幕中间 左下 左上 右上 右下的代码集合
Mar 10 Javascript
EASYUI TREEGRID异步加载数据实现方法
Aug 22 Javascript
js jq 单击和双击区分示例介绍
Nov 05 Javascript
jQuery获取URL请求参数的方法
Jul 18 Javascript
js前端日历控件(悬浮、拖拽、自由变形)
Mar 02 Javascript
微信小程序开发之数据存储 参数传递 数据缓存
Apr 13 Javascript
微信小程序之数据双向绑定与数据操作
May 12 Javascript
Django使用多数据库的方法
Sep 06 Javascript
详解vue 命名视图
Aug 14 Javascript
Javascript原生ajax请求代码实例
Feb 20 Javascript
Js逆向实现滑动验证码图片还原的示例代码
Mar 10 Javascript
javascript局部自定义鼠标右键菜单
Dec 08 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
PHP数据库调用类调用实例(详细注释)
2012/07/12 PHP
Laravel 4 初级教程之安装及入门
2014/10/30 PHP
解决yii2左侧菜单子级无法高亮问题的方法
2016/05/08 PHP
PHP实现批量检测网站是否能够正常打开的方法
2016/08/23 PHP
详解PHP数据压缩、加解密(pack, unpack)
2016/12/17 PHP
jQuery 第二课 操作包装集元素代码
2010/03/14 Javascript
JavaScript 以对象为索引的关联数组
2010/05/19 Javascript
jQuery版Tab标签切换
2011/03/16 Javascript
js 设置缓存及获取设置的缓存
2014/05/08 Javascript
怎么引入(调用)一个JS文件
2016/05/26 Javascript
Bootstrap CSS布局之图像
2016/12/17 Javascript
浅谈vue的踩坑路
2017/08/31 Javascript
jquery 获取索引值在一定范围的列表方法
2018/01/25 jQuery
Vue.js 表单控件操作小结
2018/03/29 Javascript
jQuery实现简单弹幕效果
2019/11/28 jQuery
JavaScript的console命令使用实例
2019/12/03 Javascript
vue v-for出来的列表,点击某个li使得当前被点击的li字体变红操作
2020/07/17 Javascript
three.js 如何制作魔方
2020/07/31 Javascript
[41:08]TNC vs VG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
python解析html开发库pyquery使用方法
2014/02/07 Python
通过Python使用saltstack生成服务器资产清单
2016/03/01 Python
python机器学习理论与实战(一)K近邻法
2021/01/28 Python
django 修改server端口号的方法
2018/05/14 Python
Python reduce函数作用及实例解析
2020/05/08 Python
python不到50行代码完成了多张excel合并的实现示例
2020/05/28 Python
浅谈pytorch中的BN层的注意事项
2020/06/23 Python
Numpy中np.random.rand()和np.random.randn() 用法和区别详解
2020/10/23 Python
编码转换,怎样实现将GB2312编码的字符串转换为ISO-8859-1编码的字符串
2014/01/07 面试题
abstract 可以和 virtual 一起使用吗?可以和 override 一起使用吗?
2012/10/15 面试题
社区两委对照检查材料
2014/08/23 职场文书
代办出身证明书
2014/10/21 职场文书
2014年党风建设工作总结
2014/11/19 职场文书
大学生党性分析材料
2014/12/19 职场文书
申论不会写怎么办?教您掌握这6点思维和原则
2019/07/17 职场文书
python解决12306登录验证码的实现
2021/04/18 Python
解析原生JS getComputedStyle
2021/05/25 Javascript