下拉菜单的js实现时为什么隐藏不了?

来源:2-4 下拉菜单--JavaScript触发方法

木子车

2017-01-06 11:39

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>下拉菜单--属性声明式方法(一)</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">

</head>
<body>

<h3>示例2</h3>
<ul class="nav nav-pills">
    <li class="dropdown">
  <a href="##"  class="dropdown-toggle" role="button" id="tutorial">教程<b class="caret"></b></a>
  <ul class="dropdown-menu" role="menu" aria-labelledby="tutorial">
   <li role="presentation"><a href="##">CSS3</a></li>
   <li role="presentation"><a href="##">HTML5</a></li>
   <li role="presentation"><a href="##">Sass</a></li>
  </ul>
 </li>

</ul>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

<!--下面是代码任务区-->
<script>
    $(function(){
         $(".dropdown-toggle").dropdown() ; 
    });
</script>

</body>
</html>

写回答 关注

3回答

  • 木木_sen
    2017-10-10 16:24:45

    如官网上所说,data-toggle="dropdown"不能省略

    data-toggle="dropdown" still required

    Regardless of whether you call your dropdown via JavaScript or instead use the data-api, data-toggle="dropdown" is always required to be present on the dropdown's trigger element.


    apianm...

    那直接用data-toggle="dropdown"不就可以了,为什么还要用JS呢

    2018-02-24 10:17:36

    共 1 条回复 >

  • 照世孤灯
    2017-09-13 15:27:55

    <script>
    $(function(){
       $(".dropdown-toggle").one("click",function(){
           $(this).dropdown("toggle");
       })
    })
    </script>

  • 慕粉1937534925
    2017-01-06 20:14:30

    在a标签那边少了data-toggle="dropdown"

玩转Bootstrap(JS插件篇)

带领大家学习怎么使用JS自由控制Bootstrap中提供的组件

128659 学习 · 303 问题

查看课程

相似问题