1. 程式人生 > >鋒利的jquery第四章

鋒利的jquery第四章

1.繫結事件
bind():

2.合成事件
hover():
hover(enter,leave);滑鼠懸停,滑鼠移出

toggle(fn1,fn2,...fnn):
模擬滑鼠連續點選
第一次點選觸發:(fn1)
第二次點選觸發:(fn2)
第N次點選觸發:(fnn)

第二個作用:
切換元素的可見狀態

2.事件冒泡
事件會按照DOM的結構像水泡一樣不斷上升到頂端
3.停止事件冒泡
event.stopPropagation();  --等於 return false;

4.阻止預設行為
preventDefault();	--等於 return false;

5.事件捕獲:
jquery不支援事件捕獲

6.事件物件的屬性:

(1).event.type
$("a").click(function(){
 	event.type;//獲取事件型別--click
})

(2).event.target
$("a[href='http://google.com']").click(function(){
 	event.target;//獲取事件物件--http://google.com
})

省略事件物件的屬性

7.移除事件
unbind([type],[data]);
沒有引數,將刪除所有的繫結事件
$("#id").unbind("click");
	$(function(){
		$("#繫結id").bind('click', myFun1 = function(){
			$("#id1").append("<p>第一個繫結</p>");
		}).bind('click', myFun2 = function(){
			$("#id2").append("<p>第一個繫結</p>");
		})
		//解綁單獨某一個事件
		$("#delId").click(function(){
			$("#繫結id").unbind("click", myFun2);
		})

	})

one(type,[type],fn):
	當處理函式觸發一次後,立即被刪除。

8.模擬操作:
trigger(type,[data]):
可以觸發瀏覽器支援的屬性,也可以觸發自己自定義的屬性。

9.一次性為元素繫結多個事件
$("#id").bind('mouseover mouseout', function(){
	$(this).toggleClass("over");
})


9.1.新增事件名稱空間便於管理



******4.2--jquery中的動畫略過******