Question

如何处理元素的点击，而不是点击该元素中的链接？说我有以下

<div class="section">
    Some text blah blah
    <a href="#">Link</a>
</div>
<script>
    $(".section").click(function() {
        // code to expand/collapse section
    });
</script>

我希望用户能够点击.section以展开/折叠它，但如果他们点击该部分中的链接，我不希望这种情况发生。

Answer 1

您可以检查事件目标，只有div才能执行操作。这是一个例子：

$(".section").click(function(e) {
    if(e.target.tagName !== "DIV") {
      //Not the div! 
    }
});

您可以测试target的各种属性，因此，例如，如果您有其他子div元素，但又不想在这些元素上注册点击，则可以使用{{1} property：

className

这是working example（使用e.target.className !== "section"属性）。

Answer 2

var $section = $(".section");
$section.click(function(e) {
    if ($(e.target).get(0) == $section.get(0)) {
        alert("expanding...");
    }
});

http://jsfiddle.net/yLMVy/

Answer 3

$(".section").click(function(e) {
    if($(e.target).is('a')) {
      return;
    }

    // code to expand/collapse section
});

e.target指向用户点击的元素。因此该函数检查目标是否为a元素。如果是，它只是从函数

返回

Answer 4

在函数

的末尾使用return false;

处理元素的点击，但不点击该元素中的链接

4 个答案: