Question

我的所有引导代码都在工作，但模态除外。 Modal显示，但整个屏幕都很暗。也就是说，模态似乎“落后于”灰色。

  <link href="assets/css/bootstrap.css" rel="stylesheet">
  <link href="assets/css/bootstrap-responsive.css" rel="stylesheet"> 
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <script src="assets/js/bootstrap.js"></script>

  <a href="#myModal" data-toggle="modal">Login</a>

  <div id="myModal" class="modal hide fade in" aria-hidden="true">
      <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">X</button>
           <h3 id="myModalLabel">Log in</h3>
       </div>
       <div class="modal-body">
         <p>
            <form class="modal-form" id="loginform" >
              <input type="text" name="username" placeholder="login" id="username">
              <input type="text" name="password" placeholder="password" id="userpassword">
             </form>
          </p>
        </div>
        <div class="modal-footer">
            <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
            <button class="btn btn-success">Login</button>
        </div>
   </div>

Answer 1

看起来您需要在＆lt;之前将脚本添加到脚本中。 / head＆gt;

<script type="text/javascript">
 $(function () { 
    $("#myModal").modal({show:false});
});  
</script>

Answer 2

我真的不明白这个问题吗？

我刚刚在jsfiddle中尝试了你的代码：http://jsfiddle.net/zFHAJ/，一切似乎都运行良好？

<!DOCTYPE html>
<html>
    <head>
        <link href="http://moi007.dyndns.org/igestis/theme/iabsis_v2//css/bootstrap.css?2.0-4" rel="stylesheet">
    <link href="http://moi007.dyndns.org/igestis/theme/iabsis_v2//css/bootstrap-responsive.css" rel="stylesheet"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script src="http://moi007.dyndns.org/igestis/theme/iabsis_v2//js/bootstrap.js?2.0-4"></script>
    </head>
    <body>


  <div id="myModal" class="modal hide fade in" aria-hidden="true">
      <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">X</button>
           <h3 id="myModalLabel">Log in</h3>
       </div>
       <div class="modal-body">
            <form class="modal-form" id="loginform" >
              <input type="text" name="username" placeholder="login" id="username">
              <input type="text" name="password" placeholder="password" id="userpassword">
             </form>
        </div>
        <div class="modal-footer">
            <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
            <button class="btn btn-success">Login</button>
        </div>
   </div>

       <a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
</body>
</html>

也许你有一些与引导程序冲突的其他自定义css？

Answer 3

在

之前放置bootstrap.js或bootstrap.min.js

＆＃13;

</body>

＆＃13;

Answer 4

<body>
  <table id = "league_data">
  <tr><th>Pos</th><th>Name</th><th>Points</th>
  </tr>
  </table>

  <script>
     $(document).ready(function(){
           $.ajax({
               type: "GET",
               url: "https://spreadsheets.google.com/feeds/list/<MyID>/2/public/values",
               dataType: "html",
               success: function(xml){
                 console.log("here");$
                   $(xml).find('entry').each(function(){
                       var Pos = $(this).find('gsx:name').text();
                       var Name = $(this).find('gsx:name').text();
                       var Points = $(this).find('gsx:totalpoints').text();
                       $('<tr></tr>').html('<th>' +Pos+ '</th><td>$' +Name+ '</td><td>$' +Points+ '</td>').appendTo('#league_data');
                   });
               }
           });
   });
  </script>

</body>

Twitter Bootstrap模态是黑暗的？

4 个答案: