jquery中的事件

1:加载DOM：

（1）$(document).ready(function(){

})

(2)$().ready(function(){

})

(3)$(function(){

})

2:事件绑定

（1）$(function(){

$("#panel h5.head").bind("click", function(){

$(this).next().show();

})

})

3:合成事件

（1）hover（enter，leave）;

当鼠标移动到元素上时，会触发指定的第一个函数（enter），当鼠标离开时，会触发第二个函数（leave）

$(function(){

$("#panel h5.head").hover(function(){},function(){})

})

(2)toggle(fn1, fn2, fn3......fnN)

toggle()方法用于模拟鼠标连续单击事件。第1次单击元素，触发指定的第一个函数（fn1）；当再次单击同一个元素时，则触发第2个函数（fn2）；如果有更多的函数，则依次触发，直到最后一个。随后的每次单击都重复对这几个函数的轮番调用。

4:事件冒泡

（1）事件对象

$("element").bind("click", function(event){     //event：事件对象

//...

})

当单击“element”元素时，事件对象就被创建了，这个事件对象只有事件处理函数能够访问到。事件处理函数执行完毕后，事件对象就被销毁。

（2）停止事件冒泡

$("element").bind("click", function(event){     //event：事件对象

//...

event.stopPropagation();

})

(3)阻止默认行为

$("element").bind("click", function(event){     //event：事件对象

//...

if(username==""){

event.preventDefault(); 

}

})

阻止事件的默认行为，比如单击超链后会跳转、单击“提交”按钮后表单会提交等。

如果想同时对事件对象停止冒泡和默认行为，可以在事件处理函数中返回false。

（4）事件捕获

事件捕获和事件冒泡是刚好相反的两个过程，事件捕获是从最顶端往下开始触发。

5:事件对象的属性

（1）event.type  事件类型

（2）event.preventDefault()方法   阻止默认的事件行为

（3）event.stopPropagation()方法   阻止事件冒泡行为

（4）event.target     获取到触发事件的元素

（5）event.relatedTarget   访问相关元素

（6）event.pageX和event.pageY   获取到光标相对于页面的x坐标和y坐标

（7）event.which    在鼠标单击事件中获取到鼠标的左、中、右键，在键盘事件中获取键盘的按键。

（8）event.metaKey   为键盘事件中获取<ctrl>按键

6：移除事件

（1）<button id="delAll">删除所有事件</button>

$("#delAll").click(function(){

$("#btn").unbind("click");

})

7:模拟操作：

$("#btn").trigger("click");

trigger()方法不仅能够触发浏览器支持的具有相同名称的事件，也可以触发自定义名称的事件。

$("button").click(function(){

$("div").trigger("click!");

})

若单击<button>元素，则只触发click事件，而不触发click.plugin事件。注意，trigger("click!")后面感叹号的作用是匹配所有不包含在命名空间中的click方法。