使用 javascript 显示模式窗口

Question

我想根据 javascript 中的 bool 变量显示模态对话框。最好的方法是将 bool 变量绑定到某个属性（例如可见性），当变量为 true 时，会出现模式对话框，如果为 false，它将被关闭（将显示“背景”站点）。

我在 jquery 1.9.1 和 bootstrap 3.3.7 中使用 this bootstrapious 模板。我在网上找到了一些相关的主题，我尝试使用它们：

1) 起初我使用了模态对话框 div 的某些属性，例如可见性，我将使用我的代码输出真或假。我的意思是使用style="visibility:hidden"/visible，但是当它设置为可见时，它不会自动出现。

2) 使用来自 getbootstrap.com 的提示：$('#myModal').modal('show') 和其他出现在 onload 或 on document ready 的变体

$(document).ready(function(){
   jQuery.noConflict();
   $('#myModal').modal('show');
});

或

    $(document).on('load',function(){
        $('.modal').modal('show');
});

没有任何作品。

最后我会使用类似的东西

if(myVar == true)
     modal.show()
else
     modal.hide()

甚至有可能意识到这一点吗？ 任何帮助表示赞赏！

Answer 1

试试这个！

HTML

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
        ...
      </div>
      <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>
    </div>
  </div>
</div>

和javascript

jQuery(document).ready(function(e) {
    jQuery('#myModal').modal();
});