DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> jQuery學習筆記之jQuery的事件
jQuery學習筆記之jQuery的事件
編輯:JQuery特效代碼     

一.事件綁定

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

例子
代碼如下:
$(function(){
$(#id1).click(function(){
$(#id2).show();//id2顯示
}) ;
});

二.合成事件
1.鼠標滑過事件
.hover(enter,leave)
enter:鼠標光標移動到對象時觸發的函數
leave:鼠標光標移出對象觸發的函數

例子:
代碼如下:
$(function(){
$(#id1).hover(function(){
$(#id2).show();//id2顯示
},function(){
$(#id2).hide();//id2隱藏
}) ;
});


2.連續單擊事件
.toggle(fn1,fn2.......,fnN)
fn:單擊第一次執行fn1,第二次fn2,以此類推

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

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

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

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

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

例子:
代碼如下:
$(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.綁定多個事件
.bind(type [,data],fn).bind(type [,data],fn)...... ;
.bind(type type..... [,data],fn) ;
2.添加事件命名空間
.bind(type.namespace [,data],fn) ;
使用時只需指定命名空間即可,如:$(#id1).unbind(".namespace")

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved