下拉菜单不起作用

时间:2016-11-12 16:30:53

标签: jquery css dropdown togglebuttonbar

我的下拉菜单无效.. 我的数据切换属性有问题.. 这是我的html代码:

<div class="col-md-8 col-sm-6"  >
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle Navigation </span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>

    </div>

    <div class="navbar-collapse collapse  ">
        <ul class="top-nav nav navbar-nav navbar-right">
            <li class="nli" ><a href="index.html">Home</a></li>
            <li class="nli" ><a href="#">About</a></li>



            <li class="nli" ><a href="#signin" data-toggle="modal">Sign In</a></li>
            <li class="nli" ><a href="#">Contact</a></li>
            <li class="top-nav dropdown">
                <a href="#" class=" dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Services <span class="caret"></span></a>
                <ul class=" drop dropdown-menu">
                    <li class="dli" ><a href="#">Animation</a></li>
                    <li class="dli"><a href="#">Animation</a></li>
                    <li class="dli"><a href="#">Animation</a></li>
                </ul>
            </li>
        </ul>
        </div>
        </div>
        </div>
    </div>
</div>

我在页脚中添加了jquery:

<script src="bootstrap/js/jquery.js" type="text/javascript"></script>

1 个答案:

答案 0 :(得分:1)

您可以通过toggle

来实现
$('.dropdown-toggle').click(function() {
  $('ul.drop').toggle();
});