Question

奇怪的问题。当启动模态窗口的按钮位于窗体div内时，模态窗口无法启动。 Chrome说＆＃34;资源被解释为脚本，但使用MIME类型text / x-js传输：＆＃34; 我已经为源js添加了一个类型，但它没有帮助。我也在早些时候将调用移到了页面中并且没有用。真正奇怪的部分是，如果我在窗体div之外移动按钮，模态打开就没问题了。有没有人经历过这一点，可以指出我正确的方向。提前致谢

编辑：这是代码（我剪切了内容）

<div class="container">
<form class="form-inline" role="form">
  <div class="form-group">
    <label for="companyName">Company Name</label>
    <input type="text" class="form-control" id="companyName" placeholder="Company Name">
  </div>
  <div class="form-group">
    <label for="chainCode">Chain Code</label>
    <input type="text" class="form-control" id="chainCode" placeholder="Chain Code">
  </div>
  <div class="form-group">
    <label for="nCode">N-Code</label>
    <input type="text" class="form-control" id="nCode" placeholder="N-Code">
  </div>
  <button type="submit" class="btn btn-success">Search</button>
  <button class="btn btn-warning" data-toggle="modal" data-target="#advancedModal"> Advanced
    <span class="glyphicon glyphicon-cog"></span>
  </button>
</form>

<!-- Advanced Modal -->
<div class="modal fade" id="advancedModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <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="myModalLabel">Advanced Options</h4>
      </div>
      <div class="modal-body">
        <form role="form" id="myForm" method="post">
          <div class="form-group">
</form><!-- end advanced form -->
      </div><!-- end modal-body -->
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-   dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div><!-- end modal-footer -->
    </div><!-- end modal content -->
  </div><!-- end modal dialog large -->
</div><!-- end Advanced Modal -->
</div><!-- End Form Container -->

Answer 1

不知怎的，在我看来，bootstrap以某种方式与表单中的button混淆。所以尝试使用

<a class="btn btn-warning" data-toggle="modal" data-target="#advancedModal">
    Advanced <span class="glyphicon glyphicon-cog"></span>
</a>

而不是

<button class="btn btn-warning" data-toggle="modal" data-target="#advancedModal">
    Advanced <span class="glyphicon glyphicon-cog"></span>
</button>

它应该有用，看起来也一样。

Bootstrap Modal没有在表格div中启动

1 个答案: