Question

我有一个包含twitter bootstrap库的应用程序。 JQuery库作为第一个库加载，接下来加载所有其他库。但由于某种原因，我的模态窗口不起作用。控制台中没有错误。我有几乎相同的应用程序，相同的代码工作得很好。

以下是代码：

<body ng-app="calcA" ng-controller="calcACtrl">
  <div class="calc-container" ng-cloak>
    <form class="calc-fields" name="choice" novalidate ng-hide="types.individual || types.kids || types.family || types.car">
        <!-- my code -->
        </div>
    </form>
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document"  style="width: 75%; height :95%; font-size: small">
            <div class="modal-content">
                <div class="modal-header" style="margin: 0; padding: 5px 10px 2px 2px !important">
                    <button type="button" class="close" data-dismiss="modal" ng-click="closeIndividual()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <p class="modal-title" id="myModalLabel" style="text-align: center"><b>Modal Title</b></p>
                </div>
                    <div class="modal-body" style="padding: 5px">
                      <div ng-hide="!types.individual">
                        <!-- my code -->
                      </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    ...

Answer 1

首先，给予： 1.首先加载jQuery 2.在

之后加载Boostrap js

然后，模态需要从事件中触发，例如在页面加载或按钮点击时。

对于您的实例，可能是一个按钮，如：

<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
  Launch demo modal
</button>

<强>文件： http://getbootstrap.com/javascript/#live-demo

通过jQuery调用它的替代方法： http://getbootstrap.com/javascript/#modals-methods

Twitter引导模式窗口不会出现

1 个答案: