快捷導(dǎo)航

jQuery學(xué)習(xí)筆記之jQuery的事件

更新時(shí)間：2010年12月22日 14:37:24 作者：

事件總是由內(nèi)層開始執(zhí)行，一直到最外層，不單擊了那個(gè)對(duì)象，所有包含了此對(duì)象的對(duì)象所綁定的事件都將執(zhí)行一次，這是我們不愿意看到的，jQuery給我們定義了一些阻止事件執(zhí)行的方法。

一.事件綁定

1.事件綁定函數(shù)
事件的綁定函數(shù)為如下形式：
.bind(type [,data],fn)
type:類型如click.....
data:參數(shù)
fn:事件執(zhí)行的函數(shù)

例子

復(fù)制代碼代碼如下:

 
$(function(){ 
$(#id1).click(function(){ 
$(#id2).show();//id2顯示 
}) ; 
}); 

二.合成事件
1.鼠標(biāo)滑過(guò)事件
.hover(enter,leave)
enter:鼠標(biāo)光標(biāo)移動(dòng)到對(duì)象時(shí)觸發(fā)的函數(shù)
leave:鼠標(biāo)光標(biāo)移出對(duì)象觸發(fā)的函數(shù)

例子：

復(fù)制代碼代碼如下:

 
$(function(){ 
$(#id1).hover(function(){ 
$(#id2).show();//id2顯示 
},function(){ 
$(#id2).hide();//id2隱藏 
}) ; 
}); 

2.連續(xù)單擊事件
.toggle(fn1,fn2.......,fnN)
fn：?jiǎn)螕舻谝淮螆?zhí)行fn1,第二次fn2,以此類推

三.事件冒泡
事件總是由內(nèi)層開始執(zhí)行，一直到最外層，不單擊了那個(gè)對(duì)象，所有包含了此對(duì)象的對(duì)象所綁定的事件都將執(zhí)行一次，這是我們不愿意看到的，jQuery給我們定義了一些阻止事件執(zhí)行的方法
1.事件對(duì)象獲取
獲取事件對(duì)象的方法就是為事件執(zhí)行函數(shù)添加一個(gè)參數(shù)
$(#id1).click(function(even){});//even就是獲取到的事件對(duì)象
2.阻止事件冒泡
我們可以在事件執(zhí)行函數(shù)中加入如此啊代碼，阻止事件冒泡
even.stopPropagation();
3.阻止默認(rèn)事件
瀏覽器默認(rèn)事件是指，按鈕單擊后提交，單擊鏈接后打開鏈接等，jQuery也可以阻止這些默認(rèn)事件的執(zhí)行
even.preventDefault();

四.獲取事件對(duì)象的屬性
even.type();//獲取事件的類型，
如：
$(#id1).click(function(even){
alert(even.type);
return false;
});//返回“click”

even.target();//獲取觸發(fā)事件的對(duì)象

even.while();獲取鼠標(biāo)單擊的1=左，2=中，3=右鍵

五.移除事件
.unbind(type [,data]);

例子：

復(fù)制代碼代碼如下:

 
$(function(){ 
$(#id1).bind("click",fn1=function(){alert(“事件1”);}) 

.bind("click",fn2=function(){alert(“事件2”);}); 
.bind("click",fn3=function(){alert(“事件3”);}); 
}); 

$("#id2").click(function(){ 
$(#id1).unbind("click",fn2);//刪除fn2的click事件 
}); 

六.其他操作
1.綁定多個(gè)事件
.bind(type [,data],fn).bind(type [,data],fn)...... ;
.bind(type type..... [,data],fn) ;
2.添加事件命名空間
.bind(type.namespace [,data],fn) ;
使用時(shí)只需指定命名空間即可，如：$(#id1).unbind(".namespace")

您可能感興趣的文章: