鍍金池/ 問答/網(wǎng)絡(luò)安全  HTML/ javascript 如何讓子元素的事件失效？

javascript 如何讓子元素的事件失效？

  • 首先，wrapper看作一個(gè)滾動容器
  • 里面的元素可能有各種事件
  • 但是當(dāng)我拖拽wrapper后，不希望子元素的事件發(fā)生
  • 我想通過[一系列]判斷，然后決定子元素事件是否允許執(zhí)行
  • 這個(gè)如何實(shí)現(xiàn),在線等!!!!
  • 看了大家的解決辦法，有的說刪掉子元素的事件，但是，這些事件有可能是他人加上的，所以不采用！

<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
    #wrapper{width:200px;height:200px;background:#eee;}
    #test{margin:10px;}
</style>

</head>
<body>

<div id="wrapper">
    <button id="test">按鈕</button>
    <a >這是一個(gè)超鏈接</a>
</div>

<script>        
    document.getElementById("wrapper").onmousemove = function () {
        // 如果產(chǎn)生拖拽，就不執(zhí)行子元素的所有事件
        // 包括 click、超鏈接等
    };
    
    document.getElementById('test').onclick = function (e) {
        alert('子元素')
    }
</script>

</body>
</html>

回答
編輯回答
愛是癌

document.getElementById('test').onclick=null;

2017年7月2日 07:45
編輯回答
扯不斷

你把

document.getElementById('test').onclick = function (e) {
    alert('子元素')
}

這段代碼刪了不就行了嗎

2017年11月4日 23:36
編輯回答
九年囚

在父元素的函數(shù)改為

document.getElementById("second").addEventListener("click",function(){
    alert('父元素');
    event.stopImmediatePropagation();
},true);
2017年8月23日 05:37
編輯回答
初心

子元素阻止冒泡試試

document.getElementById('wrapper').onclick = function (e) {
        alert('父元素')
    }

    document.getElementById('test').onclick = function (e) {
        e.stopPropagation();
        alert('子元素');
    }
2018年1月2日 16:36
編輯回答
旖襯

沒人了嗎，來位大神指點(diǎn)一下。。

2018年5月3日 09:00
編輯回答
影魅

理論上父元素上如果有點(diǎn)擊事件，目標(biāo)過程肯定父級先捕捉到。這個(gè)時(shí)候如果子元素還有點(diǎn)擊事件其實(shí)可以代理到父元素上，有父元素判斷點(diǎn)擊發(fā)生在哪里。而且子元素和父元素一樣大的話，點(diǎn)擊事件邏輯上就是沖突的。還是在父元素上用代理吧。

2018年9月2日 14:40
編輯回答
笨笨噠
document.getElementById('wrapper').addEventListener("click", function (e){
    e.stopPropagation();
    alert('父元素')
}, true);

查MDN是個(gè)好習(xí)慣
event.stopImmediatePropagation() 會阻止這個(gè)元素后面的同類型事件監(jiān)聽函數(shù)

2018年4月2日 09:20