Question

这就是我通过使用带有sass的boostrap“租借”的方式，这就是当我点击我添加到菜单中的下拉菜单时所以它不会“降低”，换句话说就是展示自己。

我在菜单上已经这样做了。

<li class="dropdown">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="true">Opret <span class="caret"></span></a>
    <ul class="dropdown-menu" role="menu">
        <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 class="dropdown-header">Nav header</li>
        <li><a href="#">Separated link</a></li>
        <li><a href="#">One more separated link</a></li>
    </ul>
</li>

在页面底部，当我收集Bootstrap到我的visual studio Express 2013时，我添加了新版本的jquery和随包附带的旧版本

<script src="../Scripts/jquery-2.1.3.js"></script>
<script src="../javascripts/js/lightbox.js"></script>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="../js/bootstrap.min.js"></script>

修改

<script src="../javascripts/js/lightbox.js"></script>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="../js/bootstrap.min.js"></script>

编辑2

<head runat="server">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Instruktor Panel</title>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
    <link href="../stylesheets/StyleSheet.css" rel="stylesheet" />
    <link href="../stylesheets/css/lightbox.css" rel="stylesheet" />
</head>

编辑3 - 我发现问题位于此处：

<script src="../javascripts/bootstrap.min.js"></script>

是我写过它是在js但是它全部是在javascript

Answer 1

jquery js文件有两个版本。删除其中一个，然后再试一次。

<script src="../Scripts/jquery-2.1.3.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

我刚刚复制了你的html代码并添加了jquery和bootstrap js文件。它适用于 FIDDLE

这是HTML代码

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title> - jsFiddle demo by User86745458</title>  
  <link rel="stylesheet" type="text/css" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
});//]]>  

</script>
</head>
<body>
  <li class="dropdown">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="true">Opret <span class="caret"></span></a>
    <ul class="dropdown-menu" role="menu">
       <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 class="dropdown-header">Nav header</li>
       <li><a href="#">Separated link</a></li>
       <li><a href="#">One more separated link</a></li>
    </ul>
 </li>  
  <script type='text/javascript' src='http://code.jquery.com/jquery-2.1.0.js'></script>  
  <script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>

Answer 2

建议将其他javascript插件或您自己的javascript放在<head>

上

<head>
      <script src="../javascripts/js/lightbox.js"></script>
</head>


<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="../js/bootstrap.min.js"></script>

点击下拉不会降下来

2 个答案: