我在頁面上有以下標記
<div id="box">
<div id="box_child_one"></div>
<div id="box_child_two"></div>
<div id="box_child_three"></div>
</div>
我需要在#box div 內的所有元素上觸發onmousedown事件，所以我有這個 javascript 代碼：
var element = "#box";
document.querySelector(element).onmousedown = function() {
alert("triggered");
};
但是，我不希望在#box_child_three元素上觸發 onm ousedown。我怎樣才能做到這一點？
謝謝你。
uj5u.com熱心網友回復：
檢查event.target以找出實際單擊了哪個元素。
var element = "#box";
document.querySelector(element).onmousedown = function(e) {
if (e.target.id !== "box_child_three") {
alert("triggered");
}
};<div id="box">
<div id="box_child_one">one</div>
<div id="box_child_two">two</div>
<div id="box_child_three">three</div>
</div>uj5u.com熱心網友回復：
您需要在stopPropagation單擊元素三時觸發事件，以免它冒泡到父 ( box) 元素。
document.getElementById('box').addEventListener('click', () =>
alert('triggered')
);
document.getElementById('box_child_three').addEventListener('click', e =>
e.stopPropagation()
);<div id="box">
<div id="box_child_one">one</div>
<div id="box_child_two">two</div>
<div id="box_child_three">three</div>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/416957.html
標籤：
上一篇：使用區分大小寫的setAttributeNS后的querySelector
下一篇：單擊按鈕三下后如何激活新功能