Question

我有3个嵌套的div ..

<div onclick="highlight(this)">1  
   <div onclick="highlight(this)">2
     <div onclick="highlight(this)">3 
        </div> 
    </div>
</div>

要停止事件冒泡，我想为div添加语法 - stopPropagation（）。

我已尝试过（仅限第一个div）

document.querySelectorAll("div")[0].setAttribute("onclick", "event.stopPropagation()");

但它没有用。什么是解决方案/替代方案.. ??

我希望div好像..

<div onclick="highlight(this) event.stopPropagation()">1

Answer 1

当您需要停止传播事件时，似乎有意义的是相应的操作附加到事件本身。这是使用它的一种可能方式：

<强> HTML

<div id="outer" onclick="highlight(event, this)">
    <div id="middle" onclick="highlight(event, this)">
        <div id="inner" onclick="highlight(event, this)">

        </div>
    </div>
</div>

<强> JS

function highlight(event, target) {
    event.stopPropagation();
    console.log( target.id + ' is clicked' );
}

Demo

setAttribute用于Javascript函数

1 个答案: