Bootstrap.js无法正常工作

时间:2017-06-21 18:44:17

标签: html css twitter-bootstrap

这是我的HTML代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html lang="ru">
      <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
        <title>Tasks</title>

        <!-- Bootstrap -->
        <link href="css/bootstrap.css" rel="stylesheet">
        <link href="css/mystyle/style.css" rel="stylesheet">
        <link href="css/mystyle/equal-height-columns.css" rel="stylesheet"/>
        <link href="css/mystyle/auto-colums.css" rel="stylesheet"/>
        <link href="css/mystyle/navbar-style.css" rel="stylesheet"/>


        <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
          <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->
        </head>
        <body>

        <div class="navbar navbar-default navbar-static-top">
            <div class="container">
                <a class="navbar-brand" href="/">Tasks</a>
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#responsive-menu">
                        <span class="sr-only">Открыть навигацию</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>  
                </div>

                <div class="collapse navbar-collapse" id="responsive-menu">
                    <ul class="nav navbar-nav">
                        <li><a href="index.php">Добавить задачу</a></li>
                        <li><a href="tasks.php">Список задач</a></li>
                    </ul>

                    <ul class="nav navbar-nav navbar-right">
                        <li class="dropdown">
                          <a href="#" class="dropdown-toggle" data-toggle="dropdown"><b>Войти</b> <span class="caret"></span></a>
                            <ul id="login-dp" class="dropdown-menu">
                                <li>
                                     <div class="row">
                                            <div class="col-md-12">
                                                 <form class="form" role="form" method="post" action="login" accept-charset="UTF-8" id="login-nav">
                                                        <div class="form-group">
                                                             <label class="sr-only" for="inputLogin">Login</label>
                                                             <input type="text" class="form-control" id="inputLogin" placeholder="Логин" required>
                                                        </div>
                                                        <div class="form-group">
                                                             <label class="sr-only" for="inputPass">Password</label>
                                                             <input type="password" class="form-control" id="inputPass" placeholder="Пароль" required>
                                                        </div>
                                                        <div class="form-group btn-submit">
                                                             <button type="submit" class="btn btn-primary btn-block">Войти</button>
                                                        </div>
                                                 </form>
                                            </div>
                                     </div>
                                </li>
                            </ul>
                        </li>
                    </ul>

                </div>

            </div>
        </div>

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

Bootstrap.js无法正常工作,无法解释原因。

档案目录:

-project
--index.php
--js
---bootstrap.js

我也试过这个选项:

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

我复制了新项目,旧的同一个项目一切正常。 我很困惑,谢谢你的任何帮助。

1 个答案:

答案 0 :(得分:0)

您是否尝试在浏览器中查看控制台是否加载?应该是大多数浏览器上的F12开发工具。 另外,请尝试CDN链接:http://getbootstrap.com/getting-started/