91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

Js冒泡事件阻止的方法是什么

發布時間:2022-02-08 09:32:32 來源:億速云 閱讀:116 作者:iii 欄目:開發技術

這篇文章主要介紹“Js冒泡事件阻止的方法是什么”的相關知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強,希望這篇“Js冒泡事件阻止的方法是什么”文章能幫助大家解決問題。

一. 事件目標

現在,事件處理程序中的變量event保存著事件對象。而 event.target 屬性保存著產生事件的目標元素。這個屬性是 DOM API 中規定的,但是沒有被所有瀏覽器實現 。jQuery對這個事件對象進行了必要的擴大,從而在任何瀏覽器中都能夠使用這個屬性。通過.target,可以肯定DOM中首先接收到事件的元素(即實際被單擊的元素)。而且,我們知道this援用的是處理事件的DOM元素,所以可以編寫以下代碼:

$(document).ready(function(){

 $('#switcher').click(function(event){

  $('#switcher .button').toggleClass('hidden');

  })

 })

$(document).ready(function(){

 $('#switcher').click(function(event){

  if(event.target==this){

  $('#switcher .button').toggleClass('hidden');

  }

  })

 })

此時的代碼確保了被單擊的元素是<div id="switcher"> ,而不是其他后代元素。現在,單擊按鈕不會再折疊樣式轉換器,而單擊邊框則會觸發折疊操作。但是,單擊標簽一樣甚么也不會產生,由于它也是一個后代元素。實際上,我們可以不把檢查代碼放在這里,而是通過修改按鈕的行動來到達目標 。

二. 停止事件傳播

事件對象還提供了一個 .stopPropagation() 方法,該方法可以完全禁止事件冒泡。與 .target 類似,這個方法也是一種純 JavaScript 特性,但在跨瀏覽器的環境中則沒法安全地使用 。不過,只要我們通過jQuery來注冊所有的事件處理程序,就能夠放心腸使用這個方法。

下面,我們會刪除剛才添加的檢查語句 event.target == this,并在按鈕的單擊處理程序中添加一些代碼:

$(document).ready(function(){

 $('#switcher .button').click(funtion(event){

  //……

   event.stopPropagation();

  })

 }) 

同之前一樣,需要為用作單擊處理程序的函數添加一個參數,以便訪問事件對象。然后,通過簡單地調用 event.stopPropagation() 就能夠避免其他所有 DOM 元素響應這個事件。這樣一來,單擊按鈕的事件會被按鈕處理,而且只會被按鈕處理。單擊樣式轉換器的其他地方則可以折疊和擴大全部區域。

三. 默許操作

如果我們把單擊事件處理程序注冊到一個錨元素,而不是一個外層的<div>上,那末就要面對另外一個問題:當用戶單擊鏈接時,瀏覽器會加載一個新頁面。這類行動與我們討論的事件處理程序不是同一個概念,它是單擊錨元素的默許操作。類似地,當用戶在編輯完表單后按下回車鍵時,會觸發表單的 submit 事件,在此事件產生后,表單提交才會真正產生。

如果我們不希望履行這類默許操作,那末在事件對象上調用 .stopPropagation() 方法也杯水車薪,由于默許操作不是在正常的事件傳播流中產生的。在這類情況下,.preventDefault() 方法則可以在觸發默許操作之前終止事件 。

提示 當在事件的環境中完成了某些驗證以后,通常會用到 .preventDefault()。例如,在表單提交期間,我們會對用戶是不是填寫了必填字段進行檢查,如果用戶沒有填寫相應字段,那末就需要禁止默許操作。我們將在第8章詳細討論表單驗證。

事件傳播和默許操作是相互獨立的兩套機制,在兩者任何一方產生時,都可以終止另外一方。如果想要同時停止事件傳播和默許操作,可以在事件處理程序中返回 false,這是對在事件對象上同時調用 .stopPropagation() 和 .preventDefault() 的一種簡寫方式。

關于“Js冒泡事件阻止的方法是什么”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業相關的知識,可以關注億速云行業資訊頻道,小編每天都會為大家更新不同的知識點。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

js
AI

宁陕县| 太康县| 平顶山市| 镇远县| 秦安县| 周宁县| 莱西市| 通许县| 新沂市| 平顺县| 秦安县| 都昌县| 平安县| 泰安市| 循化| 永宁县| 海宁市| 平乐县| 明星| 二连浩特市| 田东县| 兰坪| 仙桃市| 佛山市| 天峨县| 英山县| 浠水县| 鹤壁市| 株洲县| 长汀县| 贵州省| 陆良县| 蕲春县| 依兰县| 扎鲁特旗| 光山县| 长春市| 武强县| 桂平市| 饶阳县| 三台县|