如何從觸發排除特定的子元素

可能重複：
Prevent execution of parent event handler 如何從觸發排除特定的子元素

我使用的是一個很好的插件（jQuery drop-down）增加一個下拉到錶行：

屬性放置在包含要顯示的菜單的ID的觸發器對象上。在這種情況下，表格行中的「數據下拉列表」。

<tr data-dropdown="#dropdown-first"> 
    <td><a href="http://www.boston.com">Basic</a></td> 
    <td>The basic plan</td> 
</tr>

我的問題是其中一個TD包含鏈接，但鏈接將始終觸發下拉菜單而不是啓動新頁面。這是調用菜單中的插件代碼片段：

$(function() { 
    $('BODY').on('click.dropdown', '[data-dropdown]', showMenu); 
    $('HTML').on('click.dropdown', hideDropdowns); 
});

是否有修改的。對事件排除特定的子標籤的選擇方式，如我的鏈接？還有另外一個建議的策略嗎？我希望儘可能保持插件的完整性，以便高度可重用。

來源

2012-10-18 eggs

問題是你是將數據下拉屬性放在行上。點擊該行內的任何內容都會觸發該事件，並且showMenu內部的邏輯甚至不檢查一旦點擊任何內容時它不應該繼續。

整行是否必須導致下拉？如果沒有，請將數據下拉列放在行內的某個東西上。

否則，修改jquery.dropdown.js和event.preventDefault前添加此在行41，（）行：

if (trigger != event.target && $(event.target).hasClass('dropdown-ignore')) return;

則類「下拉菜單，忽略」添加到您的boston.com鏈接。

來源

2012-10-18 19:05:29 noel

它不需要整行可點擊（我可以添加兄弟圖標或鏈接來獲取下拉列表），但它很適合爲用戶提供大型目標。我會嘗試第二個選項，這是有道理的，維護/提高插件的靈活性......謝謝！ – eggs

由於我解決了這個問題，我向插件作者claviska提交了一個pull請求。他們可能包含代碼並使其成爲「官方」。 – noel

完美：添加你的行和這個：$（「table.menutable a」）。addClass（'dropdown-ignore'）;打擊作者的好主意。我認爲這是一個有益的補充。 – eggs

你可以嘗試取消綁定與相關聯的所有點擊事件持有的（插件實例化後）

HTML

<tr data-dropdown="#dropdown-first"> 
    <td class="disable-dropdown"><a href="http://www.boston.com">Basic</a></td> 
    <td>The basic plan</td> 
</tr>

JAVASCRIPT

$('.disable-dropdown').unbind('click');

來源

2012-10-18 18:46:08

這會禁止更多情況下的下拉菜單，而不僅僅是包含標籤的單元格嗎？也許：$（'tr.disable-dropdown td a'）。unbind（'click'）; ?? – eggs

如何從觸發排除特定的子元素

回答

相關問題