JQuery中的事件

目录：

① 页面加载时触发ready事件

② 使用bind()方法绑定元素的事件

③ 使用hover()方法切换事件

④ 使用toggle()方法绑定多个函数

⑤ 使用unbind()方法一处元素绑定的事件

⑥ 使用one()方法绑定元素的一次性事件

⑦ 使用trigger()方法手动触发指定的事件

⑧ 文本框的focus和blur事件

⑨ 下拉列表框的change事件

 

 

① 页面加载时触发ready事件

ready()事件类似于onLoad()事件，但前者是在DOM结构加载后便触发，而后者是在页面全部元素加载成功后才触发。

$(document).ready(function(){}); 等价于 $(function(){});

 

② 使用bind()方法绑定元素的事件

bind()方法绑定元素要知道被绑定的元素名、绑定的事件名称、事件中执行的函数内容就可以

$(selector).bind(event,[data] function);

1>event:事件名称

2>function:事件执行函数

 

③ 使用hover()方法切换事件

$(selector).hover(overFunc,outFunc);

hover()函数，当鼠标移入时，将执行第一个函数，鼠标移出时，则执行第二个函数。

 

④ 使用toggle()方法绑定多个函数

toggle()方法可以在click函数中绑定两个或两个以上的方法，如：

$(selector).toggle(func1(),func2(),func3(),funcN());

 

⑤ 使用unbind()方法一处元素绑定的事件

$(selector).unbind(event,func)

该方法用于移除以绑定的事件。

 

⑥ 使用one()方法绑定元素的一次性事件

one()方法可以绑定元素任何有效事件，但这种绑定的事件只能触发一次

$(selector).one(event,[data],func);

1>event:方法触发时的事件名称

2>[data]:触发时事件携带的数据

3>func:触发时的函数

这个方法绑定的事件，只会被执行一次，例如，如果绑定了一个click事件，那么该事件执行一次后不能重复执行。

 

⑦ 使用trigger()方法手动触发指定的事件

$(selector).trigger(event);

该方法用于手动触发某个事件，要么系统事件，要么自定义事件，但是这些事件必须能执行。

 

⑧ 文本框的focus和blur事件

1>focus用于获取焦点时触发，如点击文本框时，触发该事件。

2>blur为失去焦点时触发，如点击除了文本框的任何元素。

$(selecotr).bind(focus,function(){});

$(selector).bind(blur,function(){});

 

⑨ 下拉列表框的change事件

当一个元素的值发生改变时，就会触发change事件，

$(selector).bind("change",function(){});