jquery - 我不想要底层 div 的 jQuery 点击事件

Question

我有一些带有点击操作的 div 和里面的另一个 div - 右上角的“close-cross” 女巫关闭第一个或其他任何地方。

问题是，当单击关闭交叉 div 时，也会调用主 div 单击操作。理论上两者都被单击，因为按下了鼠标按钮，并且鼠标指针位于两个 div 上方，但我只希望直接单击的 div 调用其单击事件。

Answer 1

您想使用该event.stopPropagation()方法。这可以防止事件在 DOM 树中冒泡。请参阅此处的 jQuery 文档

Answer 2

在关闭函数中，您需要调用 event.stopPropagation()

http://api.jquery.com/event.stopPropagation/

这将防止事件冒泡到父 div。有关事件冒泡的更多信息：

什么是事件冒泡和捕获？

Answer 3

事件冒泡，这就是所谓的，可以使用以下方法进行检查：

$(document).ready(function() {
$('#main').click(function(event) {
if (event.target == this) {
//Your code here
}
});
});

事件的event.stopPropagation();停止旅程

$(document).ready(function() {
    $('#close-cross').click(function(event) {

    //Your code here
   event.stopPropagation();
    });
    });

Answer 4

检查这个小提琴

$(document).ready(function() {
     // Outer Div click Event
    $('div.a').on('click', function(e) {
        if (e.target.className === 'b') {
            e.preventDefault();
        }
        else {
            alert('Outer Div Clicked !!');

        }
    });

    // Inner Div Click event
    $('div.b').on('click', function(e) {
        alert('Inner Div Clicked !!');
    });
});​