如何最好地取消嵌套可點擊元素？

我有一種情況，看起來像這樣如何最好地取消嵌套可點擊元素？

<div class="x" href="foo"> 
    <div class="y" href="bar"></div> 
    <div class="z"></div> 
    <div class="y" href="baz"></div> 
    <a href="#">fooz</a> 
</div>

x是應該可以點擊徽章。問題是徽章還包含也應點擊的鏈接。另外y和z是可點擊的。不幸的是，點擊孩子鏈接只會導致被按下的外部x。我應該如何最好地處理這樣的事情？

來源

2011-09-23 Hubro

我我無法複製你的情況 - 你能否提供一個例子，例如。在jsfiddle上？ –

標籤不應該嵌套，這是不標準的做法或有效，這就是爲什麼你可能遇到問題。它實際上在我的瀏覽器（Chrome 14）中工作，但這並不是說它會在每個瀏覽器中都能正常工作。是不是有不同的方式來編寫你的場景，這將消除嵌入標籤的需求，那麼它幾乎肯定會起作用，如果不是，我們可以更容易地進行調試，因爲它是應該工作的東西 – Chris

我剛剛使用'a'元素來表明它們是可點擊的元素。我不知道嵌套鏈接無效，但我的問題實際上是嵌套可點擊塊元素。我將編輯問題 – Hubro

從我以前的評論繼續（假設我理解您的方案是正確的），這裏是您的解決方案：http://jsfiddle.net/chricholson/7yzxQ/12/

它涉及到使用stopPropagation防止點擊被檢測出樹形結構http://api.jquery.com/event.stopPropagation/

來源

2011-09-23 09:17:04 Chris

這不起作用，它不是有效的html，因爲嵌套的a -elements是不允許的。對於解決方案需要更多信息。

來源

2011-09-23 08:34:36 iwg

我認爲你不應該把<a>標籤放到另一個<a>。這裏的解決方案可能是使用javascript和事件冒泡，或者你應該分開鏈接，並以某種方式放置/設置它們，以便看到一個完整的徽章。在html中，你實際上會從單獨的元素中構建它。

就我個人而言，我會選擇javascript方式，因爲它更直接。

來源

2011-09-23 08:36:19 Ashnur

如何最好地取消嵌套可點擊元素？

回答

相關問題