为什么这个 bootstrap / impress.js Qt Web 应用程序中的模态表单没有显示？答案

【问题标题】：Why is the modal form in this bootstrap / impress.js Qt web application not showing?为什么这个 bootstrap / impress.js Qt Web 应用程序中的模态表单没有显示？
【发布时间】：2015-06-28 15:53:12
【问题描述】：

我正在尝试使用 bootstrap 和 impress.js 制作一个 Qt Web 应用程序。

我使用了在这里找到的 bootstrap.css：http://pastebin.com/raw.php?i=dTdEky6N 来处理 impress.js。

问题是，虽然其他引导组件似乎正确显示，但我根本无法显示模态表单。当我单击“打开模式”时没有任何反应。我也尝试在 Firefox 中查看该页面，但模态表单仍然无法显示。

任何帮助将不胜感激。如果我没有提供分析问题所需的一切，请耐心等待。

<link href="css/impress-demo.css" rel="stylesheet" />
<link href="css/bootstrap.css" rel="stylesheet" />

....

<div class="step slide bootstrapslide" data-x="1000" data-y="-1500">
    <div class="btn-group">
      <button class="btn">Left</button>
      <button class="btn">Middle</button>
      <button class="btn">Right</button>
    </div>
    <div class="btn">
      <button class="btn">Left</button>
      <button class="btn">Middle</button>
      <button class="btn">Right</button>
    </div>

    <p><span class="label label-success">Success</span></p>
    <p><span class="label label-warning">Warning</span></p>
    <p><span class="label label-danger">Danger</span></p>
    <p><span class="label label-info">Info</span></p>


    <!-- Trigger the modal with a button -->
    <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>

    <!-- Modal -->
    <div id="myModal" class="modal fade" role="dialog">
      <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Modal Header</h4>
          </div>
          <div class="modal-body">
            <p>Some text in the modal.</p>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          </div>
        </div>

      </div>
    </div>

</div>

...

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="js/impress.js"></script>
<script src="js/bootstrap.js"></script>
<script>impress().init();</script>

【问题讨论】：

标签： twitter-bootstrap qt qtwebkit impress.js

【解决方案1】：

只是更新：我找到了答案。看来 bootstrap.js 和 bootstrap.css 不是来自同一个版本。修复该问题后，模态表单现在可以正确显示

【讨论】：