引导莫代尔美体含量不隐藏

这种模态完美的作品：下面引导莫代尔美体含量不隐藏

<!-- Modal --> 
<div class="modal fade" id="company-about" tabindex="-1" role="dialog" aria-labelledby="company-about-label" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title" id="company-about-label">Company Name</h4> 
     </div> 
     <div class="modal-body"> 
      <p>Company bio here...</p> 
     </div> 
     </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 
</div><!-- /.modal -->

这种模态紧随上述模态，但是该表显示，而不是被隐藏。单击时，表格内容为空白。如果我删除的表数据，并用文字代替，它按预期工作：

<!-- Modal --> 
<div class="modal fade" id="fee-details" tabindex="-1" role="dialog" aria-labelledby="fee-details-label" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title" id="fee-details-label">Fees - What this loan will cost you to close</h4> 
     </div> 
     <div class="modal-body"> 
      <table class="table table-condensed"> 
       <thead> 
        <tr> 
        <th>Header1</th> 
        <th>Header2</th> 
        <th>Header3</th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr> 
        <td>data1</td> 
        <td>data2</td> 
        <td>data3</td> 
        </tr> 
       </tbody> 
      </table> 
      </div> 
     </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 
</div><!-- /.modal -->

来源

2014-01-20 TimNguyenBSM

请张贴的jsfiddle或链接到你的网页.. –

正如我可以在这里看到，拨弄你的代码（添加一个按钮启动模式）的http：// bootply.com/107315，它的工作.... – pbenard

@ Jahnux73我创建了一个jsfiddle，它不工作。 http://jsfiddle.net/mty3g/14/ – TimNguyenBSM

你必须将你的代码的模态表之外。我通常会在< /正文>标签前的页面底部放置模态代码。

见工作小提琴：http://jsfiddle.net/mty3g/19/

<body> 

<div class="container"> 

<table class="table table-width-condensed spacer-top"> 

    <tr> 
     <td><a href="#fee-details" data-toggle="modal">$800</a></td> 
     <td><a href="#company-about" data-toggle="modal">Company Name</a></td> 
    </tr> 

</table> 

</div> <!-- /container --> 

<!-- Modal --> 
<div class="modal fade" id="company-about" tabindex="-1" role="dialog" aria-labelledby="company-about-label" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
       <h4 class="modal-title" id="company-about-label">Company Name</h4> 
      </div> 
      <div class="modal-body"> 
       <p>Company summary...</p> 
      </div> 
     </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 
</div><!-- /.modal --> 

<!-- Modal --> 
<div class="modal fade" id="fee-details" tabindex="-1" role="dialog" aria-labelledby="fee-details-label" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
       <h4 class="modal-title" id="fee-details-label">Fee Details</h4> 
      </div> 
      <div class="modal-body"> 
       <table class="table table-condensed"> 
        <thead> 
         <tr> 
          <th>Header1</th> 
          <th>Header2</th> 
         </tr> 
        </thead> 
        <tbody> 
         <tr> 
          <td>data1</td> 
          <td>data2</td> 
         </tr> 
        </tbody> 
       </table> 
      </div> 
     </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 
</div><!-- /.modal --> 


<!-- Bootstrap core JavaScript 
================================================== --> 
<!-- Placed at the end of the document so the pages load faster --> 
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script> 
<script src="js/bootstrap.js"></script> 
</body>

来源

2014-01-20 21:23:24

救命吧，谢谢！ –

引导莫代尔美体含量不隐藏

回答

相关问题