jquery 筆記 事件
更新時間：2011年11月02日 11:06:43 作者：
寫js已經有很久了，但是對js的詳細了解還是很膚淺的，這幾天在看jquery，在其中有一些新的發(fā)現和體會，記錄下來
瀏覽器模型：
1、DOM第0級模型
事件處理程序通過吧函數實例的引用指派到DOM元素的屬性而聲明。這也是我們最常見的，如onclick等
<img onclick="alert('hello');" src="1.jpg" />
$("img").onmouseover = function(){alert("hello");}
（1）、其中比較好玩的是Event實例和事件冒泡
Event實例是大多數瀏覽器把事件的類實例作為第一個參數傳給函數，但是ie中則是將event指定到window的屬性；在獲取目標元素w3c標準瀏覽器存在target，ie則取srcElement屬性，為兼容事件如下寫：
$("img").onclick=function(event){
if(!event) event = window.event;
var target = event.target?event.target:event.srcElement;
}
（2）、事件冒泡
目標元素獲得機會吃力事件，事件模型堅持目標元素的父元素，看是否為同類型建立了處理程序，如果是，則也調用處理程序，直到DOM樹頂部
對于w3c標準瀏覽器可使用event的stopPropagation(),對于ie可使用event的cancelBubble取消冒泡
2、第2級模型
解決0級模型中每個屬性存儲事件只能注冊一個處理程序缺陷。
$("img").addEventListener('click',function1,false).addEventListener('click',function2,false);
在2級模型中，事件被觸發(fā)，先從DOM樹向下傳播到目標元素（捕捉階段），再向上冒泡，上面的addEventListener第三個參數為false時建立冒泡型處理程序，為ture時建立捕捉型處理程序。
這里的捕捉型也是第一次聽說，因為ie6和7就不支持第2級模型，所以也難怪，但部分ie瀏覽器支持類似冒泡型的有attachEvent(eventName,handler)。
那么jquery的bind則我們解決了這些。。。
參考《jquery實戰(zhàn)》
1、DOM第0級模型
事件處理程序通過吧函數實例的引用指派到DOM元素的屬性而聲明。這也是我們最常見的，如onclick等
復制代碼 代碼如下:
<img onclick="alert('hello');" src="1.jpg" />
$("img").onmouseover = function(){alert("hello");}
（1）、其中比較好玩的是Event實例和事件冒泡
Event實例是大多數瀏覽器把事件的類實例作為第一個參數傳給函數，但是ie中則是將event指定到window的屬性；在獲取目標元素w3c標準瀏覽器存在target，ie則取srcElement屬性，為兼容事件如下寫：
復制代碼 代碼如下:
$("img").onclick=function(event){
if(!event) event = window.event;
var target = event.target?event.target:event.srcElement;
}
（2）、事件冒泡
目標元素獲得機會吃力事件，事件模型堅持目標元素的父元素，看是否為同類型建立了處理程序，如果是，則也調用處理程序，直到DOM樹頂部
對于w3c標準瀏覽器可使用event的stopPropagation(),對于ie可使用event的cancelBubble取消冒泡
2、第2級模型
解決0級模型中每個屬性存儲事件只能注冊一個處理程序缺陷。
復制代碼 代碼如下:
$("img").addEventListener('click',function1,false).addEventListener('click',function2,false);
在2級模型中，事件被觸發(fā)，先從DOM樹向下傳播到目標元素（捕捉階段），再向上冒泡，上面的addEventListener第三個參數為false時建立冒泡型處理程序，為ture時建立捕捉型處理程序。
這里的捕捉型也是第一次聽說，因為ie6和7就不支持第2級模型，所以也難怪，但部分ie瀏覽器支持類似冒泡型的有attachEvent(eventName,handler)。
那么jquery的bind則我們解決了這些。。。
參考《jquery實戰(zhàn)》
相關文章
jQuery form插件之formDdata參數校驗表單及驗證后提交
Form Plugin API 里提供了很多有用的方法可以讓你輕松的處理表單里的數據和表單的提交過程,通過本文給大家介紹jQuery form插件之formDdata參數校驗表單及驗證后提交的相關知識，感興趣的朋友一起學習吧2016-01-01
Django中使用jquery的ajax進行數據交互的實例代碼
這篇文章主要介紹了Django中使用jquery的ajax進行數據交互的相關知識，非常不錯，具有參考借鑒價值 ,需要的朋友可以參考下2017-10-10
jQuery插件Zclip實現完美兼容個瀏覽器點擊復制內容到剪貼板
本文將結合實例講解如何使用一款基于jQuery的插件——Zclip來實現復制內容到剪貼板的功能。其實IE上有個方法可以實現點擊復制，但是由于只是IE獨有，所以我們不提倡。而Zclip是利用一個隱藏的flash文件來完成復制的功能，關鍵是它兼容當前各主流瀏覽器。2015-04-04
這篇文章主要為大家詳細介紹了JQuery實現表格數據行上移與下移，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-02-02
這篇文章主要介紹了jQuery上傳多張圖片帶進度條樣式,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2017-03-03
本文主要介紹了用jQuery實現優(yōu)酷首頁輪播圖的思路與方法。具有一定的參考價值，下面跟著小編一起來看下吧2017-01-01
下面小編就為大家?guī)硪黄猨Query基礎知識點總結(DOM操作)。小編覺得挺不錯的，現在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-06-06
可以設置左邊菜單項div的overflow-x:auto;overlfow-y:auto;這樣就會自動生成了滾動條，但是大家都知道自帶的不好看。接下來就是重點了，如何修改滾動條的樣式呢？感興趣的朋友可以了解下本文2013-07-07
如果你用過ASP.NET的數據綁定控件，也用過ASP或者JSP里那種通過輸出HTML元素在頁面上顯示數據的方法，你就知道ASP.NET數據綁定控件有多么方便。如果能夠將同樣的功能在瀏覽器端用HTML和JavaScript實現，那該是多少美妙的事情。2010-05-05
本篇文章是對jQuery中的自動完成組件進行了詳細的分析介紹，需要的朋友參考下2013-06-06