Question

可能重复：
Prevent parent container click event from firing when hyperlink clicked

我有

<div onClick="someJScode();">
  ...
  <div></div>
  ...
</div>

单击内部div时，我不希望调用someJScode()。怎么做？

Answer 1

$('yourinnerDiv').click(function(e){e.stopPropagation()});

这将停止点击事件冒泡DOM http://api.jquery.com/event.stopPropagation/
https://developer.mozilla.org/en/docs/DOM/event.stopPropagation

Answer 2

你可以试试这个：

<强> HTML

<div onClick="someJScode();" class="parent">
  <div class="child" onclick="childCallback(event)"></div>
</div>

<强>的JavaScript

function someJScode() {
    alert('Click!');
}

function childCallback(event) {
    event.stopImmediatePropagation();
    return false;
}

<强> DEMO

上面的代码使用stopImmediatePropagation您还可以使用stopPropagation

这是更通用的解决方案：

var preventChildrenPropagation = (function (parentClass) {
    var preventPropagation = function (event) {
        event.stopPropagation();
        return false;
    }
    return function (parent) {
        var foreach = Array.prototype.forEach;
        foreach.call(document.getElementsByClassName(parent), function (e) {
            foreach.call(e.children, function (c) {
                c.onclick = preventPropagation;
            });
        });
    }
}());

preventChildrenPropagation('parent');

方法preventChildrenPropagation将阻止＆＃34;父母＆＃34;的所有孩子的所有click事件的传播。元件。

单击内部div不要调用外部的onClick函数

2 个答案: