JQUERY事件集合
JQUERY事件集合：
?
删除特定函数的绑定，将函数作为第二个参数传入
jQuery?代码:
var foo = function () {
??//?处理某个事件的代码
};
$("p").bind("click", foo); // ...?当点击段落的时候会触发?foo?
$("p").unbind("click", foo); // ...?再也不会被触发 foo
?
?
?
?
?
例子
$(document).ready(funciton(){
???var?fn1 =?function() {
??????????????????????alert("click");
????????????????? };
??var?fn2 =?function() {
??????????????????????alert("click again");
????????????????? }?????????
??$("p").bind("click", fn1)
??????????????? ??$("p").bind("mouseover",?function() { $(this).css("background-color",?"red") })
??????????????????.bind("mouseout",?function() { $(this).css("background-color",?"white") });
$("#btn1").bind("click",?function() {
??????????????????????$("p").unbind("click", fn1);
// $("p").unbind();?移除全部事件
????????????????? });
})
注意，事件的移除，移除的事件必须以变量，或事件名的形式
如 $(“p”).unbind(“click”,funciton(){alert(“click again”)})?这样移除是不行的
必须?$(“p”).unbind(“click”,fn2)
?交互处理?hover(over,out)
一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。这是一个自定义的方法，它为频繁使用的任务提供了一种“保持在其中”的状态。
当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数。而且，会伴随着对鼠标是否仍然处在特定元素中的检测（例如，处在div中的图像），如果是，则会继续保持“悬停”状态，而不触发移出事件（修正了使用mouseout事件的一个常见错误）。
返回值:jQuery
参数
over (Function) :?鼠标移到元素上要触发的函数
out (Function) :?鼠标移出元素要触发的函数
示例
鼠标悬停的表格加上特定的类
jQuery?代码:
$("td").hover(
??function () {
????$(this).addClass("hover");
??},
??function () {
????$(this).removeClass("hover");
??}
);
?
toggle(fn,fn)
每次点击后依次调用函数。
如果点击了一个匹配的元素，则触发指定的第一个函数，当再次点击同一元素时，则触发指定的第二个函数，如果有更多函数，则再次触发，直到最后一个。随后的每次点击都重复对这几个函数的轮番调用。
可以使用unbind("click")来删除。
返回值:jQuery
参数
fn (Function) :?第一数次点击时要执行的函数。
fn2 (Function) :?第二数次点击时要执行的函数。
fn3,fn4,... (Function) :?更多次点击时要执行的函数。
示例
对表格的切换一个类
jQuery?代码:
$("td").toggle(
??function () {
????$(this).addClass("selected");
??},
??function () {
????$(this).removeClass("selected");
??}
);
对列表的切换样式
HTML?代码:
??<ul>
????<li>Go?to?the?store</li>
????<li>Pick?up?dinner</li>
????<li>Debug?crash</li>
????<li>Take?a?jog</li>
??</ul>
$("li").toggle(
??????function?()?{
????????$(this).css({"list-style-type":"disc",?"color":"blue"});
??????},
??????function?()?{
????????$(this).css({"list-style-type":"disc",?"color":"red"});
??????},
??????function?()?{
????????$(this).css({"list-style-type":"",?"color":""});
??????}
????);
?
?
事件
blur()?触发每一个匹配元素的blur事件。失去焦点的时候触发
这个函数会调用执行绑定到blur事件的所有函数，包括浏览器的默认行为。可以通过返回false来防止触发浏览器的默认行为。blur事件会在元素失去焦点的时候触发，既可以是鼠标行为，也可以是按tab键离开的
返回值：jQuery
blur(fn)
在每一个匹配元素的blur事件中绑定一个处理函数。
blur事件会在元素失去焦点的时候触发，既可以是鼠标行为，也可以是按tab键离开的
返回值：jQuery
参数
fn (Function) :?在每一个匹配元素的blur事件中绑定的处理函数。
示例
任何段落失去焦点时弹出一个 "Hello World!"在每一个匹配元素的blur事件中绑定的处理函数。
jQuery?代码:
$("p").blur( function () { alert("Hello World!"); } );
同类用法的事件有：
change().change(fn)
click(), click(fn)
dblclick() , dblclick(fn)
error() , error(fn)
focus() , focus(fn)
keydown() , keydown(fn)
keypress() , keypress(fn)
keyup() , keyup(fn)
load(fn)
mousedown(fn)
mousemove(fn)
mouseout(fn)
mouseover(fn)
mouseup(fn)
resize(fn)
scroll(fn)
select() , select(fn)
submit() , submit(fn)
unload(fn)
模拟操作
1，?常用模拟
以上的例子都是用户必须通过单击按钮，才能触发click事件，但是有时，需要模拟用户来操作，以达到点击的效果。例如在用户进入页面后，就触发click事件，而不需要用户去主动点击。
?在jquery中，可以使用trigger()方法来模拟操作，例如可以使用下面的代码触发id为btn的按钮的click事件
$(‘#btn’).trigger(“click”);
?也可以使用简化写法click(),来达到同样效果
$(‘#btn’).click();
触发自定义事件
Trigger（）方法不仅能触发浏览器支持的具有相同名称的事件，也可以触发自定义名称的事件。
例如 为元素绑定一个“myclick”事件，代码如下
$(‘#btn’).bind(“myclick”,funciton(){
$(“#test”).append(“<p>我的自定义事件</p>”);
})
想要触发这个事件
$(‘#btn’).trigger(“myclick”);
传递数据
Trigger(type[,data])方法有两个参数，第一个参数是要触发的事件类型，第二个参数是要传递给事件处理函数的附加数据，以数据形式传递，通常可以传递一个参数给回调函数来区别这次事件是代码触发还是用户触发的
$(“#btn”).bind(“myclick”,function(even,message1,message2){
?? $(‘#test’).append.(“<p>”message1”+”message2”</p>”);
})
$(‘#btn’).trigger(“myclick”,[“我的自定义”,”事件”])；
执行默认操作
Trigger（）方法触发后会执行浏览器默认操作：如
$(“input”).trigger(“focus”);
以上代码不仅会触发input元素绑定的focus事件，也会使input元素得到焦点
如果只想触发绑定的fcous事件，而不想执行浏览器默认操作，可以用另一个方法triggerHandler()方法
$(“input”).triggerHandler(“focus”);
该方法会触发input绑定的特定事件，同时取消浏览器对此事件的默认操作，即文本框只触发绑定的focus事件，不会得到焦点
?
给事件添加命名空间，便于管理
$(function(){
$(“div”).bind(“click.plugin”,function(){
???? //xxxxxx
})
$(“div”).bind(“click”,function(){
???? //xxxxxx
})
$(“div”).bind(“mouseover.plugin”,function(){
???? //xxxxxx
})
$(“div”).bind(“dbclick”,function(){
})?
$(“btn”).click(funciton{
$(“div”).unbind(“.plugin”);
})
})在绑定事件后面添加命名空间。这样直接事件时，只需要指定命名空间即可、如$(“div”).unbind(“.plugin”);
否则
$(“div”).unbind(“click”) .unbind(“mouseover”);
$(“div”).bind(“click.plugin”,function(){
???? //xxxxxx
})
$(“div”).bind(“click”,function(){
???? //xxxxxx
})
$(“button”).click(funciton(){
?$(div).trigger(“click!”);
})
点击div元素后，会同时触发click.plugin事件和click事件，单击button只触发click事件
Click后面的感叹号的作用是匹配所有不包含在命名空间中的click方法
?