jQuery，使用正确的选择器

我有一个div，里面有一些文本和一些由某些span标签包围的单词。我想单击这些“spanned”单词并将div向下滑动，从而显示一个“底层”div，其中包含与该特定span文字相关的文本。当我点击div而不是一个spanned word时，我想让div滑回去。因此，我将一些行为绑定到div和这些跨度的类别上。然而，当我点击跨度时，div也会获得点击操作。当我点击跨度时，我应该如何更改选择器不要在div上接受单击操作？jQuery，使用正确的选择器

下面是代码：

<div class='mainpage'> 
    <p class='common'>bla-bla-bla <span class='footnoted' footnote='f1'>foo bar</span></p> 
</div>

jQuery代码：

$(document).ready(function(){ 
    $(".mainpage>.common>.footnoted").click(function(){ 
     alert('a'); 
    }); 

    $(".mainpage").not($(".mainpage>.common>.footnoted")).click(function(){ 
     alert('b'); 
    }); 
});

换句话说，当我在 “福吧” 点击，我得到了 “A” 和 “B” 警报，而我只想得到“一个”。我怎样才能做到这一点？

预先感谢您。 Timofey。

来源

2011-06-02 Ibolit

只需将您的代码缩进四个空格，那么就不需要使用HTML实体或HTML标记。 – 2011-06-02 14:02:02

您需要使用

event.stopPropagation();

跨度中，像这样

$('div').click(function(){alert('div clicked');}); 

$('div span').click(function(event){ 
    alert('span clicked') 
    event.stopPropagation(); 
});

Live Demo

Reference

来源

2011-06-02 14:01:12 Loktar

这太棒了！非常感谢！ – Ibolit 2011-06-02 14:05:41

d根据哪个事件首先发射，您可以尝试将return false;添加到您的点击事件功能的末尾。这应该阻止第二次点击事件发生并解决您的问题。

来源

2011-06-02 14:03:50 Sam152

jQuery，使用正确的选择器

回答

相关问题