jquery結束防止在菜單上的最終鏈接上的默認（）

我有一個幻燈片菜單，似乎工作正常，事情是如果你選擇一個鏈接它的工作，因爲它應該這樣做，如果你選擇一個鏈接一個孩子然後preventdefault（）踢，它滾動到它的孩子，我很高興，但一旦你到達鏈接的結尾，因爲沒有更多的孩子，鏈接應該正常工作，但它不。jquery結束防止在菜單上的最終鏈接上的默認（）

這裏的jQuery的

$(".menu li").click(function(e) { 
    if($(this).children('.sub-menu').length > 0) { 
     e.preventDefault(); 
     $(this).children('.sub-menu').addClass('open'); 
    } 
    else { 
     $(".menu li").ready(function(){ 
      return true; 
     }); 
    } 
});

我也附着的它的工作小提琴。

http://jsfiddle.net/R6wHG/16/

來源

2013-10-17 Dan

對不起剛纔添加它，你太快，我笑。 – Dan

問題是，您將事件處理程序綁定到<li>元素，並且單擊<a>元素向上傳播DOM。當你點擊鏈接時，它會從那個鏈接冒泡到<li>（它不包含子菜單），然後最後到另一個<li>確實包含一個子菜單，並且在那一點上默認該點擊事件的行爲（在鏈接之後）被抑制。綁定你的事件處理程序<a>元素本身，並檢查是否下一個元素是.sub-menu一個：

$(".menu a").click(function (e) { 
    if ($(this).next('.sub-menu').length > 0) { 
     e.preventDefault(); 
     $(this).next('.sub-menu').addClass('open'); 
    } 
});

Updated jsFiddle

來源

2013-10-17 12:14:34

謝謝soooo，一直以來似乎永遠都停留在這個上面，我現在又回到了後退按鈕的另一個小問題，認爲這樣做很好，但是當你走2層時，後退按鈕可以回到開始，而不是1級，所以我現在需要解決這個問題，這裏再次大聲笑。但謝謝你 – Dan

您還需要stopPropagation()作爲preventDefault()正在呼籲家長li元素：

$(".menu li").click(function (e) { 
    e.stopPropagation(); 
    if ($(this).children('.sub-menu').length > 0) { 
     e.preventDefault(); 
     $(this).children('.sub-menu').addClass('open'); 
    } 
});

Example fiddle

注意我也刪除return true，因爲它是多餘的。

來源

2013-10-17 12:14:28

嗨，這也工作，但後面的按鈕有更多的問題，如果你升到1級，後退按鈕不起作用，直到你降級並再次備份。 – Dan

@丹沒有問題，無論如何，安東尼的解決方案是更好的，因爲你應該把點擊處理程序直接放在提高事件的元素上，而不是它冒泡的父項。 –

jquery結束防止在菜單上的最終鏈接上的默認（）

回答

相關問題