Fatal编程技术网
  • jquery/
  • Jquery （引导）导航栏或模态不工作，取决于导入顺序

Jquery （引导）导航栏或模态不工作，取决于导入顺序

jquery twitter-bootstrap

Jquery （引导）导航栏或模态不工作，取决于导入顺序,jquery,twitter-bootstrap,include,modal-dialog,navbar,Jquery,Twitter Bootstrap,Include,Modal Dialog,Navbar,问题： 我的代码包含在每个网页的顶部： <html lang="en"> <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> ..metas... <link rel="shortcut icon" href="img/logo.png"> <link href="css/bootstrap.min.css" rel="stylesheet" m

问题： 我的代码包含在每个网页的顶部：

<html lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
..metas...
<link rel="shortcut icon" href="img/logo.png">

<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="css/custom.css" rel="stylesheet" media="screen">

<script src="js/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery.js"></script>
<script src="js/custom.js"></script>

<title><?php echo $pageTitle; ?></title>


…梅塔斯。。。
当bootstrap.min.js包含在jquery之前时，navbar折叠（对于小屏幕）工作（即它下降并折叠起来）。此处的导航条形码：

<body style="background-image: url('img/subtle.png');">
<nav class="navbar navbar-default" role="navigation">
<div class="navbar-header">
  <button type="button" class="navbar-toggle collapsed" 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>
  <a class="navbar-brand" href="index.php"><img height="50" src="img/brand.png"></a>
</div>

<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
  <ul class="nav navbar-nav">
    <li class="active"><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
  </ul>
  <form class="navbar-form navbar-left" role="search">
    <div class="form-group">
      <input type="text" class="form-control" placeholder="Search">
    </div>
    <button type="submit" class="btn btn-default">Submit</button>
  </form>
  <ul class="nav navbar-nav navbar-right">
    <li><a href="contact.php">Contact</a></li>
  </ul>
</div><!-- /.navbar-collapse -->
</nav>
<!--body continues -->


切换导航

    

  • 

  • 


提交

    

  •
但是情态动词不起作用：

<script type="text/javascript">
    $(window).load(function(){
        $('#updateModal').modal('show');
    });
</script>
<!-- Update modal -->
<div class="modal fade" id="updateModal" tabindex="-1" role="dialog" aria-labelledby="updateLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <a class="close" href="index.php" aria-hidden="true">&times;</a>
                <h4 class="modal-title" id="updateLabel">Update a user</h4>
            </div>
            <div class="modal-body">
                <blockquote>
                    <form action="" method="post">
                        <label for="email">Change email</label>
                        <input type="text" name="email" value="<?php echo escape($user->data()->email); ?>" autocomplete="off"><br>

                        <input class="btn btn-primary" type="submit" value="Update">
                    </form>
                </blockquote>
            </div>
            <div class="modal-footer">
                <a class="btn btn-primary" href="index.php">Cancel</a>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->


$（窗口）。加载（函数（）{
$（'#updateModel'）.modal（'show'）；
});
更新用户
更改电子邮件

Bootstrap的javascript文件（Bootstrap.min.js）不应该在jQuery之前加载，因为它依赖于jQuery。将订单更改为：


<script src="https://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>







原因是bootstrap js文件包含大量jQuery插件，要定义它们，jQuery必须可用。
bootstrap的javascript文件（bootstrap.min.js）不应在jQuery之前加载，因为它依赖于jQuery。将订单更改为：


<script src="https://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>







这是因为引导js文件包含大量jQuery插件，要定义它们，jQuery必须可用。
谢谢您的帮助！问题是我在include上导入了两次所有内容。很抱歉，此线程可能被删除？谢谢您的帮助！问题是我在include上导入了两次所有内容。抱歉，此线程可能被删除？