點擊打開Wordpress下拉菜單

我試圖打開點擊打開的wordpress下拉菜單。事情是它應該保持開放，當你選擇一個職位和頁面加載該職位。問題是我使用自定義菜單項鍊接錨鏈接到什麼都沒有（「＃」）只是爲了讓他們點擊。當我點擊「可點擊的二級標題項目」時，菜單打開，但「三級帖子」上的鏈接不起作用，而是點擊菜單時關閉菜單。點擊打開Wordpress下拉菜單

HTML：

<li id="menu-item-272" class="main menu-item menu-item-type-custom menu-item-object-custom current-menu-ancestor current-menu-parent menu-item-272"><a href="#">Main menu title item</a> 
<ul class="sub-menu" style="display: block;"> 
    <li id="menu-item-740" class="third menu-item menu-item-type-post_type menu-item-object-post menu-item-740"><a href="http://xyz.com">Post 1st lvl</a></li> 
    <li id="menu-item-741" class="third menu-item menu-item-type-post_type menu-item-object-post menu-item-741"><a href="http://xyz.com">Post 1st lvl</a></li> 
    <li id="menu-item-742" class="third menu-item menu-item-type-post_type menu-item-object-post menu-item-742"><a href="http://xyz.com">Post 1st lvl</a></li> 
    <li id="menu-item-743" class="third menu-item menu-item-type-post_type menu-item-object-post menu-item-743"><a href="http://xyz.com">Post 1st lvl</a></li> 
    <li id="menu-item-744" class="second bez menu-item menu-item-type-custom menu-item-object-custom menu-item-744"><a href="#">Clickable 2nd level title item</a> 
    <ul class="sub-menu" style="display: none;"> 
     <li id="menu-item-288" class="third menu-item menu-item-type-taxonomy menu-item-object-category menu-item-type-post_type menu-item-object-post menu-item-288"><a href="http://xyz.com">Post 3rd lvl</a></li> 
     <li id="menu-item-290" class="third menu-item menu-item-type-taxonomy menu-item-object-category menu-item-type-post_type menu-item-object-post menu-item-290"><a href="http://xyz.com">Post 3rd lvl</a></li> 
     <li id="menu-item-292" class="third menu-item menu-item-type-taxonomy menu-item-object-category menu-item-type-post_type menu-item-object-post menu-item-292"><a href="http://xyz.com">Post 3rd lvl</a></li> 
    </ul> 
</li> 
</ul> 
</li>

的jQuery：

$('#menu-header ul.sub-menu li.second:not(".third")').toggle(function() { 
     $(this).find('ul.sub-menu:first-of-type') 
      .stop(true, true).delay(50).show("slow"); 
    }, function(){ 
     $(this).find('ul.sub-menu:first-of-type') 
      .stop(true, true).delay(150).animate({ "height": "hide", "opacity": "hide" }, 400); 
    });

來源

2013-04-09 user2261218

您的代碼不起作用。你不應該將兩個函數傳遞給'toggle'，至少這是[not文檔]（http://api.jquery.com/toggle/）。你可以在[jsfiddle]（http://jsfiddle.net/）上提供一個工作示例嗎？ – montrealist 2013-04-09 12:22:37

http://jsfiddle.net/ghkEY/1/ 它正在jsfiddle上工作，但正如你所看到的，點擊下拉菜單時會打開，但是當你點擊第三級的發佈項時，下拉菜單會關閉而不是打開鏈接。 – user2261218 2013-04-10 17:52:29

在這裏，你走到哪裏，用到this answer。爲簡化起見，我簡化了代碼，並且還提供了updated your fiddle。

$('ul.sub-menu').children('.second').click(function(){ 
    $(this).children('.sub-menu').slideToggle('slow'); 
}).children('ul').find('.third').click(function (event) { 
    event.stopPropagation(); 
    console.log('hello!'); 
    return false; 
});

來源

2013-04-10 18:54:00 montrealist

只需將最後一行改爲「返回true」即可。非常感謝！！ – user2261218 2013-04-10 21:48:59

@ user2261218太好了。我只是把'return false;'放在那裏以防止瀏覽器離開jsfiddle。 – montrealist 2013-04-11 01:52:53

點擊打開Wordpress下拉菜單

回答

相關問題