javascript - Bootstrap 模式弹出背景屏幕不会关闭

Question

我正在使用 Bootstrap 和 AngularJS 来构建一个应用程序。我正在使用 Bootstrap 模式弹出窗口来显示内容。其他页面正在加载到 ng-view 中。 ng-view 的内容有模态弹出窗口，当我获得模态弹出窗口并且单击链接到下一页的按钮时，我可以看到后面的页面，但模态弹出窗口背景黑色不透明屏幕将仍然存在那里。我怎样才能摆脱这个？但是当我单独运行页面时，我没有遇到这样的问题。

代码:

<div id="regular-service" class="modal fade">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-body">
                  <!--<img class="modal-cont" src="images/popup.png">-->

                  <div class="data-extract-popup">
                       <div class="data-extract-heading">How do you want to use this data?</div> 
                        <table class="data-extract-table"> 
                        <tr>
                          <td><a href="#/clean-data" class="btn btn-lg btn-warning">CLEAN DATA</a></td>
                          <td><a href="#/raw-data" class="btn btn-lg btn-warning">RAW DATA</a></td>
                        </tr>
                        <tr>
                          <td>Cleaned up for your use.May have some missing pieces.</td>
                          <td>All pieces of data are intact here.</td>
                        </tr>
                      </table>
                    </div>
                </div>
                </div>                
            </div>
        </div>

模态:

  $(".regular").click(function(){
    $("#regular-service").modal('show');
  });

它的外观是这样的。 弹出之前

弹出后:

弹出背景仍然保持不变

Answer 1

这是模态框的一般行为，当它打开时，其背景会变得惰性并淡出。您可以选择不淡出，但在这种情况下背景也将始终是惰性的。 不淡出的方法是:

  $(".regular").click(function(){
     $("#regular-service").modal({backdrop: "false"});
  });

一个简单的 fiddle http://jsfiddle.net/bgutxt3y/ 。 尝试使用按钮“Open modal for @getbootstrap”打开模式。这个 fiddle 使用 HTML 将背景设置为 false 使用

  data-backdrop="false"

在调用 Modal 的按钮的 HTML 中