当前位置: 首页 > 图文教程 > 网络编程 > Javascript > jQuery 事件队列调整方法

Javascript
jQuery开发者都需要知道的5个小技巧
Extjs学习笔记之六 面版
Javascript 中的类和闭包
IE6下JS动态设置图片src地址问题
Extjs学习笔记之七 布局
Extjs学习笔记之八 继承和事件基础
Extjs TriggerField在弹出窗口显示不出问题的解决方法
JavaScript中的集合及效率
利用js获取服务器时间的两个简单方法
在html页面上拖放移动标签
了解jQuery技巧来提高你的代码
JavaScript 页面坐标相关知识整理
Javascript UrlDecode函数代码
JQuery 遮罩层实现(mask)实现代码
jQuery 页面 Mask实现代码
Javascript的构造函数和constructor属性
js或css文件后面跟参数的原因说明
将CKfinder整合进CKEditor3.0的新方法
jQuery UI-Draggable 参数集合
jQuery 行级解析读取XML文件(附源码)

Javascript 中的 jQuery 事件队列调整方法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-10   浏览: 146 ::
收藏到网摘: n/a

如何为已经绑定A事件的对象添加B事件,由B事件判断A事件是否触发 大家都发现,通过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,是否可以抓的到呢?