Question

我如何阻止onclick内部元素点击其父元素。

<div id="1" onclick="alert('1')">
<div id="2" onclick="alert('2')"></div>
</div>

如果第二个div（id =“2”）明显位于第一个div之上，并且单击它，则会同时获得警报1＆amp; 2。

我怎样才能避免这种情况，所以我只能从我（明显）点击的内容中得到警报，没有完全禁用外部div可能拥有的任何onclick函数。

示例： http://jsfiddle.net/DPCx8/

Answer 1

var outer = document.getElementById('outer');
outer.onclick = function(event)
    {
        alert('outer');
        event.stopPropagation();
    }
    var inner = document.getElementById('inner');
inner.onclick = function(event)
    {
        alert('inner');
        event.stopPropagation();
    }

http://jsfiddle.net/DYykA/1/

Answer 2

您需要在孩子身上stop the propagation，因此事件不会冒泡到父母身上。

$("#inner").on("click", function(e){
  e.stopPropagation();
});

Answer 3

使用event.stopPropogation();来阻止事件冒泡

jquery onclick渗透到父元素

3 个答案: