Java程序员从笨鸟到菜鸟之九十跟我学jquery六jquery中事件详解

《Java程序员从笨鸟到菜鸟之九十跟我学jquery六jquery中事件详解》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、由于jquery本身就是web客户端的有力帮手，所以事件对于它来说就显得尤为重要了，事件是脚本编程的灵魂.所以此内容也是jQuery学习的重点。在传统的javascript中，注册一个事件也是非常简单的事情，下面我们具体看一下一个简单的示例：document.getElementById("testDiv2").onclick=showMsg;等效于:<divid="testDiv1"onclick="alert("!!!");">单击

2、事件1</div>注意两者的区别了吗?我们常用的修改元素属性添加事件的方式,实际上是建立了一个匿名函数:document.getElementById("testDiv1").onclick=function(event){alert("!!!");};这个匿名函数的签名和我们手写的showMsg签名相同,所以可以把showMsg直接赋值给onclick.这种方式的弊端是:1.只能为一个事件绑定一个事件处理函数.使用"="赋值会

3、把前面为此时间绑定的所有事件处理函数冲掉.2.在事件函数(无论是匿名函数还是绑定的函数)中获取事件对象的方式在不同浏览器中要特殊处理:3.添加多播委托的函数在不同浏览器中是不一样的.所以我们首先应该摒弃<divonclick="..."></div>这种通过修改元素属性添加事件的方式.尽量使用添加多播事件委托的方式为一个事件绑定多个事件处理函数,比如为document对象的单击事件添加一个关闭弹出层的方法,使用多播就不会影响document对象原有的事件处理函数.Jquery事件：从

4、上面我们看到了javascript中注册事件的弊端了，这些弊端真正避免起来也挺麻烦的，所以jquery想到了这一点，他几乎把javascript中的事件弊端解决到了极点，我们可以很简单的实现我们在javascript中很麻烦才能实现的功能。正所谓有了jQuery,天天喝茶水.下面是在jQuery中最常使用的bind()方法举例:$("#testDiv").bind("click",showMsg);我们为id是testDiv4的元素,添加列click事件的事件处理函数showMsg.使用

5、jQuery事件处理函数的好处:1.添加的是多播事件委托.也就是为click事件又添加了一个方法,不会覆盖对象的click事件原有的事件处理函数.$("#testDiv").bind("click",function(event){alert("one");});$("#testDiv").bind("click",function(event){alert("two");});单击testDiv对象时,依次

6、提示"one"和"two".2.统一了事件名称.添加多播事件委托时,ie中是事件名称前面有"on".但是使用bind()函数我们不用区分ie和dom,因为内部jQuery已经帮我们统一了事件的名称.3.可以将对象行为全部用脚本控制.让HTML代码部分只注意"显示"逻辑.现在的趋势是将HTML的行为,内容与样式切分干净.其中用脚本控制元素行为,用HTML标签控制元素内容,用CSS控制元素样式.使用jQuery事件处理函数可以避免在HTML标签上直接添

7、加事件.Jquery常用事件函数：虽然我们可以使用事件处理函数完成对象事件的几乎所有操作,但是jQuery提供了对常用事件的封装.比如单击事件对应的两个方法click()和click(fn)分别用来触发单击事件和设置单击事件.设置单击事件:$("#testDiv").click(function(event){alert("testdivclicked!");});等效于:$("#testDiv").bind("click",function(ev

8、ent){alert("testdivclicked!");});触发单击事件:$("#testDiv").click();等效于$("#testDiv").trigger("click");注意