背景
在開發程序中，明明除錯好的阻止冒泡沒有問題，但是真正使用 時候發現阻止冒泡失效了，原來原因是點擊事件里依賴了異步回傳結果，
正常阻止冒泡寫法
<div class="aa notice"> <div class="bb notice"></div> </div> <script> var arr = document.getElementsByClassName("notice"); for(let i of arr){ i.addEventListener("click",function (e) { console.log("i",i) // 阻止冒泡 const ev = e || window.event; if (ev && ev.stopPropagation) { //非IE瀏覽器 ev.stopPropagation(); } else { //IE瀏覽器(IE11以下) ev.cancelBubble = true; } }) } </script>
阻止冒泡失效的場景：
<div class="aa notice"> <div class="bb notice"></div> </div> <script> var arr = document.getElementsByClassName("notice"); for(let i of arr){ i.addEventListener("click",function (e) { console.log("i",i) doReport(reportList, timeout).then(() => { // 阻止冒泡 const ev = e || window.event; if (ev && ev.stopPropagation) { //非IE瀏覽器 ev.stopPropagation(); } else { //IE瀏覽器(IE11以下) ev.cancelBubble = true; } }) }) } </script>
doReport是一個上報方法，這里要等待上報完成之后再執行點擊邏輯，會導致阻止冒泡失效，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/229745.html
標籤：其他
上一篇：物件的淺拷貝與深拷貝（部分整理）
下一篇：ng 11 新特性