這篇文章主要介紹JS中傳播事件、取消事件默認行為、阻止事件傳播的示例分析，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！

為曲靖等地區(qū)用戶提供了全套網(wǎng)頁設計制作服務，及曲靖網(wǎng)站建設行業(yè)解決方案。主營業(yè)務為成都網(wǎng)站設計、成都網(wǎng)站制作、曲靖網(wǎng)站設計，以傳統(tǒng)方式定制建設網(wǎng)站，并提供域名空間備案等一條龍服務，秉承以專業(yè)、用心的態(tài)度為用戶提供真誠的服務。我們深信只要達到每一位用戶的要求，就會得到認可，從而選擇與我們長期合作。這樣，我們也可以走得更遠！

1.事件處理程序的返回值 

      通常情況下，返回值false就是告訴瀏覽器不要執(zhí)行這個事件相關的默認操作。例如，表單提交按鈕的onclick事件處理程序能通過返回false阻止瀏覽器提交表單，再如a標簽的onclick事件處理程序通過返回false阻止跳轉href頁面。類似地，如果用戶輸入不合適的字符，輸入域上的onkeypress事件處理程序能通過返回false來過濾鍵盤輸入。 
      事件處理程序的返回值只對通過屬性注冊的處理程序才有意義。

2.調用順序

      文檔元素或其他對象可以為指定事件類型注冊多個事件處理程序。當適當?shù)氖录l(fā)生時，瀏覽器必須按照如下規(guī)則調用所有的事件處理程序：

通過設置對象屬性或HTML屬性注冊的處理程序一直優(yōu)先調用。
使用addEventListener()注冊的處理程序按照它們的注冊順序調用。
使用attachEvent()注冊的處理程序可能按照任何順序調用，所以代碼不應該依賴于調用順序

3.事件傳播

在調用在目標元素上注冊的事件處理函數(shù)后，大部分事件會“冒泡”到DOM樹根。調用目標的父元素的事件處理程序，然后調用在目標的祖父元素上注冊的事件處理程序。這會一直到Document對象，最后到達Window對象。

發(fā)生在文檔元素上的大部分事件都會冒泡，值得注意的例外是focus、blur和scroll事件。文檔元素的load事件會冒泡，但它會在Document對象上停止冒泡而不會傳播到Window對象。只有當整個文檔都加載完畢時才會觸發(fā)Window對象的load事件。

4.取消事件默認行為、阻止事件傳播

      在支持addEventListener()的瀏覽器中，可以通過調用事件對象的preventDefault()方法取消事件的默認操作。IE9之前的IE中，可以通過設置事件對象的returnValue屬性為false達到同樣的效果。下面一段代碼是結合三種技術取消事件：

function cancelHandler(event){
 var event=event||window.event;//兼容IE
 //取消事件相關的默認行為
 if(event.preventDefault) //標準技術
 event.preventDefault();
 if(event.returnValue) //兼容IE9之前的IE
 event.returnValue=false;
 return false; //用于處理使用對象屬性注冊的處理程序
}

取消事件相關的默認操作只是事件取消中的一種，我們也能取消事件傳播。在支持addEventListener()的瀏覽器中，可以調用事件對象的stopPropagation()方法以阻止事件的繼續(xù)傳播。如果在同一對象上定義了其他處理程序，剩下的處理程序將依舊被調用，但調用stopPropagation()之后任何其他對象上的事件處理程序將不會被調用。

 IE9之前的IE不支持stopPropagation()方法，而是設置事件對象cancelBubble屬性為true來實現(xiàn)阻止事件進一步傳播。

以上是“JS中傳播事件、取消事件默認行為、阻止事件傳播的示例分析”這篇文章的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道！