jquery中的常用事件bind、hover、toggle等示例介绍.pdfVIP

这篇文章主要介绍了 jquery 中常用的事件， 比如 $(document).ready() 、bind 、hover 、toggle 、 click 等等，并有示例，易于学习。 1.$(document).ready() $(document).ready() 是 jQuery 中响应 JavaScript 内置的 onload 事件并执行任务的一种典 型方式。它和 onload 具有类似的效果。但是也有一些差异： 当 一 个 文 档 完 全 下 载 到 浏 览 器 中 时 ， 会 触 发 window.onload 事 件 。 而 使 用 $(document).ready() 注册的事件处理程序会在 html 下载完成并解析为 Dom 树之后，代码就 可以运行，但并不意味着所有关联文件都已经下载完毕。 一个页面中一般只有一个 onload 事件处理程序， 而且只能一次保存对一个函数的引用； 而$(document).ready() 是可以有多个。 一般来说 $(document).ready() 都要优于使用 onload 事件处理程序。但是如果关联文件还 没有加载完成， 则类似图像高度、 宽度的属性的调用就会有问题， 因此需要在不同的时候选 择合适的方法。 $(document).ready() 有三种写法，分别是： $(document).ready(function(){ //thisis the coding... }); $().ready(function(){ //thisis the coding... }); $(function(){ //thisis the coding... }); 2.事件绑定 语法 $(selector).bind(event,data,function) 参数和描述： event：必需。规定添加到元素的一个或多个事件。由空格分隔多个事件。必须是有效 的事件。 data 可选。规定传递到函数的额外数据。 function 必需。规定当事件发生时运行的函数。 对应的有 unbind() ：移除事件 Eg: $( ‘#idchoose).unbind( “click ”,Function_Name) 简写绑定事件：一般比较喜欢偏向简写 $(#dividelement).bind(click,function(){//do something}) 改写为： $(#dividelement).click(function(){//do something } jQuery 通过使用 .bind() 方法为元素进行事件绑定，通过使用 .unbind() 方法为元素进行解 除绑定。而且 .bind() 方法是可以执行多次绑定的，如果没有绑定，在进行解除绑定的时候， 这都是安全的。 很多时候某一个事件只需要触发一次， 随后就要立即解除绑定， 按照传统的做法， 我们 可能会先进行事件绑定， 然后在事件执行完毕后进行解除绑定。 jQuery 为我们提供了一种简 写的方法 .one 来专门解决上述情景下的繁琐的代码编写，示例如下： $(document).ready(function(){ $(#swotcjer).one(click,toggleStyleSwitcher); }); 附带说下，用 bind 绑定事件的好处是可以定义自定义的事件，而且可以一次绑定多个 事件。 3.合成事件 在进行事件捕获的时候， 常常需要捕获组合的用户操作， 并且以多个函数作为响应， 这 些事件我