Question

我似乎找不到一个正确的方法来制作选择器，它应该只在DIV的背景和主图像上发射点击 - 如果有的话，但如果我点击该div中的其他一些元素 - 就像一个hrefs等 - 它应该什么都不做。

我试过了：

$('#SHOWCASE, #SHOWCASE > img')

Showcase - 是DIV的ID，img是直接附加到它的图像。但是，如果我添加.Click函数，它仍会触发该div中的任何元素，如链接等，请注意这些链接也具有绝对位置。

那么有什么解决办法吗？

Answer 1

以最简单的方式，只测试被点击的元素是否是您将处理程序绑定到的元素：

$('<selector>').click(function(event) {
    if(event.target === this) {
        // do something
    }
});

参考：event.target

Answer 2

这是正常行为，因为事件会使DOM冒泡。您应该检查target中的event object，看看最初点击了什么元素：

$('#SHOWCASE').on('click', function (e) {
    if ($('#SHOWCASE, #SHOWCASE > img').is(e.target)) {
        // Only do something if it was those elements.
    }
});

Answer 3

你需要阻止该div中的其他元素冒泡。像jQuery的stopPropagation（）之类的东西应该可以解决问题。将其添加到#SHOWCASE的所有孩子。

Answer 4

$('#hello, #hello > img').on('click', function(e) {
    if(e.target == this) {
        console.log(this);
    }
});

点击背景+元素的Jquery选择器？

4 个答案: