點擊子菜單

Question

我在StackOverflow上找到了非常好的問題jQuery show submenu if parent have been clicked。然後我做了一個jsfiddle，http://jsfiddle.net/JtAeh/4/用我的css和html嘗試一下。有效！但在我使用的wordpress主題中，他們已經有了一些能夠覆蓋我的新自定義腳本的腳本。

是否有可能用優雅的方式用子主題中的自定義腳本來否決父主題中的腳本？

要不然：此腳本如何更改：

var mobile_menu = function() { 
     if($(window).width() < 600 && $('body').hasClass('responsive')) {    
      $('#nav > ul, #nav .menu > ul').mobileMenu({ 
       subMenuDash : '-' 
      }); 

      $('#nav > ul, #nav .menu > ul').hide(); 
     } 
    } 
    mobile_menu(); 

    var show_dropdown = function() 
    {   
     var options;    

     containerWidth = $('#header').width(); 
     marginRight = $('#nav ul.level-1 > li').css('margin-right'); 
     submenuWidth = $(this).find('ul.sub-menu').outerWidth(); 
     offsetMenuRight = $(this).position().left + submenuWidth; 
     leftPos = -18; 

     if (offsetMenuRight > containerWidth) 
      options = { left:leftPos - (offsetMenuRight - containerWidth) };  
     else 
      options = {}; 

     $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).css(options).stop(true, true).fadeIn(300);  
    } 

    var hide_dropdown = function() 
    {        
     $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).fadeOut(300);  
    } 

    $('#nav ul > li').hover(show_dropdown, hide_dropdown); 

這個工整：

$('ul li a').click(function() { 
    $(this).parent().find('ul.sub-menu').toggle(); 
    return false; 
}); 

？

我試圖將.hover更改爲.click和.fadeIn(300)至.toggle但是這是一個遠射，並沒有工作。

希望有人能夠回答這個問題。

Answer 1

你可以嘗試在懸停刪除任何其他事件處理程序或添加你之前單擊事件（以適用者爲準：

$('ul li a').unbind('click').click(function() { 
    $(this).parent().find('ul.sub-menu').toggle(); 
    return false; 
}); 

Answer 2

我從主題開發者一些幫助，他給我發了這個劇本果然菜單到點擊菜單，而不是一個懸停菜單：

var show_dropdown = function() 
    { 
     if($(this).children('ul').length > 0) { 
      var options; 

      containerWidth = $('#header').width(); 
      marginRight = $('#nav ul.level-1 > li').css('margin-right'); 
      submenuWidth = $(this).find('ul.sub-menu').outerWidth(); 
      offsetMenuRight = $(this).position().left + submenuWidth; 
      leftPos = -18; 

      if (offsetMenuRight > containerWidth) 
       options = { left:leftPos - (offsetMenuRight - containerWidth) }; 
      else 
       options = {}; 

      $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).css(options).stop(true, true).fadeIn(300); 
      return false; 
     } else { 
      window.location = $(this).children('a').attr('href'); 
     } 
    } 

    var hide_dropdown = function() 
    { 
     if($(this).children('ul').length > 0) { 
      $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).fadeOut(300); 
      return false; 
     } 
    } 

    $('#nav ul > li').toggle(show_dropdown, hide_dropdown); 

現在，我會盡量調整它多一點得到一個子菜單隱藏在另一個被打開...感謝您的答案。