-4

我为下拉菜单找到了以下 jquery 代码。HTML 代码应该包含什么才能使用它？

jQuery(document).ready(function(){

  jQuery("html").bind("click", function (e) {
    jQuery('.dropdown-toggle, a.menu').parent("li").removeClass("open");
  });

  jQuery(".dropdown-toggle, a.menu").click(function(e) {

    //  First look an see if a menu is open.  If it is, then just close it.
    if (jQuery(this).parent("li").hasClass("open")) {
        jQuery("ul").find('li').removeClass('open');
    }

    //  If menu was not open, then close any other menus that were open and just open the one.
    else {
        jQuery("ul").find('li').removeClass('open');
        jQuery(this).parent("li").addClass('open');
    }
    return false;
  });

});
4

2 回答 2

0

您应该为您的特定情况创建自己的 HTML 和 js 代码，而不仅仅是使用 jquery 代码并猜测标记应该是什么。网上有很多教程：http ://www.google.com/search?q=tuto+menu+jquery&aq=0&oq=tuto+menu+jquery

于 2012-10-18T15:38:27.050 回答
0

你需要这个 HTML：

<div class="dropdown">
  <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown trigger</a>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
    ...
  </ul>
</div>

或者，另一种方法：

<div class="dropdown">
  <a class="dropdown-toggle" id="dLabel" role="button" data-toggle="dropdown" data-target="#" href="/page.html">
    Dropdown
    <b class="caret"></b>
  </a>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
    ...
  </ul>
</div>

在里面<UL>，你需要这样：

<ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4">
  <li><a href="#">Action</a></li>
  <li><a href="#">Another action</a></li>
  <li><a href="#">Something else here</a></li>
  <li class="divider"></li>
  <li><a href="#">Separated link</a></li>
</ul>

如果你想给一个分隔符，你可以这样给：

<li class="divider"></li>

如果您想通过 JavaScript 调用它，可以使用以下代码：

$('.dropdown-toggle').dropdown()

它以这种方式显示：

截屏

它是Twitter Bootstrap的 JavaScript DropDown 菜单插件。你可以在这里了解更多。

于 2012-10-18T15:35:52.660 回答