Question

我希望你能帮助我...我想用jQuery创建一个下拉菜单，它与浏览器中启用的javascript完美配合。现在我希望它在javascript被关闭时工作，我不太清楚如何做到这一点。

我在这里有代码，以便您自己查看。

我的html页面包含以下列表：

<!DOCTYPE HTML>
<html>
    <head>
        <script src="jquery-1.6.min.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript" src="p6.js"></script>
    </head>
    <body>
      <ul id="menu">

        <li><a href="#">What's new?</a>
          <ul class="active">
        <li><a href="#">Weekly specials</a></li>
        <li><a href="#">Last night's pics!</a></li>
        <li><a href="#">Users' comments</a></li>
          </ul>
        </li>

        <li><a href="#">Member extras</a>
          <ul>
        <li><a href="#">Premium Celebrities</a></li>
        <li><a href="#">24-hour Surveillance</a></li>
          </ul>
        </li>

        <li><a href="#">About Us</a>
          <ul>
        <li><a href="#">Privacy Statement</a></li>
        <li><a href="#">Terms and Conditions</a></li>
        <li><a href="#">Contact Us</a></li>
          </ul>
        </li>

      </ul>
    </body>
</html>

和我的.js文件

$(document).ready(function(){

    $('#menu > li > ul').hide().click(function(e){
    e.stopPropagation();
    });

    $('#menu > li').toggle(function(){
    $(this).find('ul').slideDown();
    },function(){
    $(this).find('ul').slideUp();
    });

});

感谢您的时间！

任何帮助将不胜感激！

Ĵ

Answer 1

如果javascript已关闭，则下拉菜单的唯一解决方案是使用<select>或：悬停事件并尝试使用css自定义

JS关闭==没有Javascript，没有Jquery，只是简单的HTML和CSS

Answer 2

你可以使用html和css为更现代的浏览器使用“悬停”伪类（即6和类似的不尊重悬停伪类，除了标签）。像这样：

ul#menu li ul {
    display:none
}
ul#menu:hover li ul {
    display:block
}

使用jQuery下拉菜单（渐进增强）

2 个答案: