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

Javascript
JQuery 获取和设置Select选项的代码
jQuery ctrl+Enter shift+Enter实现代码
jQuery学习2 选择器的使用说明
jQuery学习3:操作元素属性和特性
jQuery学习4 浏览器的事件模型
jQuery学习5 jQuery事件模型
jQuery 学习6 操纵元素显示效果的函数
jQuery学习7 操作JavaScript对象和集合的函数
jQuery库与其他JS库冲突的解决办法
JavaScript Event事件学习第一章 Event介绍
JavaScript Event学习第二章 Event浏览器兼容性
JavaScript Event学习第三章 早期的事件处理程序
JavaScript Event学习第四章 传统的事件注册模型
JavaScript Event学习第五章 高级事件注册模型
JavaScript Event学习第六章 事件的访问
JavaScript Event学习第七章 事件属性
JavaScript Event学习第八章 事件的顺序
js png图片(有含有透明)在IE6中为什么不透明了
JavaScript 读取元素的CSS信息的代码
基于mootools的圆角边框扩展代码

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-10   浏览: 103 ::
收藏到网摘: 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,是否可以抓的到呢?