菜單切換不起作用jquery

單擊li或href時，應打開菜單。這是一個包含在div中的ul和多個li的水平菜單。可以用多個ul來完成，但我寧可不要，因爲它代碼太重。菜單切換不起作用jquery

HTML

<ul id="mainmenu" style="width:720px"> 

    <!-- 1Open --> 
      <li id="mainmenudrop"><a href class="drop">helloooo</a> 
      <div style="width:200px height:40px; background:#000000;">hmmmmfyhyf 
</div> 
     </li> 
    <!-- 1 Close --> 
    <!-- 2nd Open --> 
     <li><a href="" class="drop">hello</a> 
      <div style="width100px; height:40px; background:#000000;"> 
       yhythyytyt 
       </div> 
      </div></li> 
    <!-- 2nd Close --> 
</ul>

的jQuery：

$(function() { 
    var toggleMenu = function(e) { 
     var self = $(this), 
      elemType = self[0].tagName.toLowerCase(), 
      //get caller 
      menu = null; 
     if (elemType === 'a') { 
      //anchor clicked, nav back to containing ul 
      menu = self.parents('li').not('li#mainmenudrop'); 
     } else if (elemType === 'li') { 
      //mouseleft ul, ergo menu is this. 
      menu = self; 
     } 
     if (menu) { 
      menu.hide('medium'); 
     } 
     e.preventDefault(); 
     return false; 
    }; 
    $(document).ready(function() { 
     $('href.drop').click(function(e) { 
      $('li#mainmenudrop li').show('medium'); 
      console.log('div clicked'); 
      e.preventDefault(); 
      return false; 
     }); 
     $('li#mainmenudrop a').click(toggleMenu); 
     $('li#mainmenudrop li').mouseleave(toggleMenu); 
    }); 
});

來源

2012-07-14 david

比它需要你做這個有很多困難。

你也有問題，你的標記和JS

href.drop應該已經a.drop

也是一個額外的結束div

但是那一切，除了這一點，你並不需要所有這些JS代碼

http://jsfiddle.net/DTqDD/

注意：您還需要做出某種類型的秋天回用JavaScript關閉用戶。

來源

2012-07-14 07:02:21 topdown

該div只是彈出打開rathen然後幻燈片，如果在瀏覽器中禁用JavaScript不只是使用正常的懸停效果而不是？ – david 2012-07-14 16:06:35

@topdown請在帖子中包含您答案的代碼。沒有這個代碼，你的帖子就沒用了。如果這個鏈接404，你的帖子是無用的。 – 2012-07-15 00:40:14

菜單切換不起作用jquery

回答

相關問題