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，使用正確的選擇器

回答

相關問題