DOM元素上jQuery事件几点学习

WEB前端开发 2012-05-08 00:05:47 浏览 3,303 次

标签 DOM jQuery

闲着无聊看了jQuery event部分的代码，发现一个小惊喜，嘿嘿，可能我奥特曼了。以下一jQuery 1.4.4版本说事，更高级版本稍有不同，但是关系不大。

jQuery 在元素上绑定事件的时候，会在该元素上添加一个自定义属性“evens”，这个属性包含了通过jQuery绑定事件的事件集合，例如：
这样一个元素：

`1`	`<a` `id="bind"` `href="#">这是一个绑定了事件的元素(bind)</a>`

我在这个元素上绑定两个click事件，一个采用“bind”，一个直接用“click”：

01
$("#bind").bind("click.hello",function(event){ 

02
event.preventDefault(); 

03
console.log("bind"); 

04
}); 

05
$("#bind").click(function(event){ 

06
event.preventDefault(); 

07
console.log("bind1"); 

08
}); 

09
var $events = $("#bind").data("events"); 

10
console.log($events);

打印出来的结果如下，

这样我们就可以做很多事情，比如事件的命名，自定义事件，判断元素上是否绑定了jQuery事件等等，

经进一步的测试发现了几点情况：

live事件绑定的元素上没有“evens”自定义属性；
hover这种扩展事件绑定的元素上有“evens”自定义属性，事件的类型包括mouseenter,mouseleave,mouseout,mouseover，jQuery 1.7事件类型略有不同；
delegate事件绑定的元素上有“evens”自定义属性，事件属性中有“live”；

好多有意思的东东，还是继续再看jQuery源码吧

建议继续学习

JQuery实现Excel表格呈现（阅读 48,165）
分享一个JQUERY颜色选择插件（阅读 14,063）
jQuery插件---轻量级的弹出窗口wBox. （阅读 10,627）
10个强大的Ajax jQuery文件上传程序（阅读 8,725）
jQuery性能优化指南（阅读 8,646）
jQuery的data()方法（阅读 8,504）
jQuery Color Animations颜色动画插件（阅读 8,347）
精于图片处理的10款jQuery插件（阅读 7,264）
PHP Simple HTML DOM Parser 是一个不错的html/xml分析类（阅读 6,946）
配合jquery实现异步加载页面元素（阅读 6,286）