不出来效果

来源:8-2 动画过渡(Transitions)

葡萄3

2016-09-15 18:55

<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8">

    <title></title>

    <link rel="stylesheet" href="test1/dist/css/bootstrap.min.css" media="screen" title="no title" charset="utf-8">

  </head>

  <body>

   <button class="btn btn-primary" type="button" name="button">点击我啊啊啊</button>

   <div class="modal" id="mymodal">

     <div class="modal-dialog">

       <div class="modal-content">

         <div class="modal-header">

           <button class="close" daa-dismiss="modal" type="button" name="button"><span aria-hidden="true">&times;</span></button>

           <h4 class="modal-title">我是标题而已</h4>

         </div>

         <div class="modal-body">

           <p>

             是啊

           </p>

         </div>

         <div class="modal-footer">

           <button class="btn btn-default" data-dismiss="modal" type="button" name="button">关闭吧</button>

           <button class="btn btn-primary" type="button" name="button">是不是保存呢</button>

         </div>

       </div>

     </div>

   </div>

  <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>

  <script scr="test1/dist/js/bootstrap.min.js"></script>

  <script type="text/javascript">

  $(function(){

    $('.btn').click(function(){

      $('#mymodal').modal('toggle')

    })

  })

  </script>

  </body>

</html>


写回答 关注

3回答

  • 星空下的小孩
    2016-12-24 22:05:11

    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">你重新引入一下CSS文件

            <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>jQuery文件

            <script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>最新的

    这些你去官网都可以找到


  • 三国小卒2
    2016-09-16 12:03:10

    我试了下,应该是你引入的文件路径有错吧,你把它修改下

  • 三国小卒2
    2016-09-16 12:02:05

    <!DOCTYPE html>

    <html>

    <head>

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>JavaScript触发时的参数设置(二)</title>

    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">

    <!-- 以下两个插件用于在IE8以及以下版本浏览器支持HTML5元素和媒体查询,如果不需要用可以移除 -->

            <!--[if lt IE 9]>

            <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>

            <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>

            <![endif]-->

    </head>

    <body>

       <button class="btn btn-primary" type="button" name="button">点击我啊啊啊</button>

    <div class="modal " id="mymodal">

        <div class="modal-dialog">

            <div class="modal-content">

    <div class="modal-header">

               <button class="close" daa-dismiss="modal" type="button" name="button"><span aria-hidden="true">&times;</span></button>

               <h4 class="modal-title">我是标题而已</h4>

             </div>

     <div class="modal-body">

      <p>

    是啊

      </p>

             </div>

    <div class="modal-footer">

               <button class="btn btn-default" data-dismiss="modal" type="button" name="button">关闭吧</button>

               <button class="btn btn-primary" type="button" name="button">是不是保存呢</button>

             </div>

    </div><!-- /.modal-content -->

    </div><!-- /.modal-dialog -->

    </div><!-- /.modal -->


     <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>

    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 

    <script>

      $(function(){

        $(".btn").click(function(){

          $("#mymodal").modal("toggle");

        });

      });

    </script>

    </body>

    </html>


玩转Bootstrap(基础)

告诉你使用Bootstrap,并且能够独立定制出适合自己的Bootstrap

314546 学习 · 2275 问题

查看课程

相似问题