引导程序3在模态弹出后禁用背景 [英] bootstrap 3 disable background after modal popup

问题描述

 < div class =modal fade 
我试着在我的代码中弹出bootstrap 3模态。 id =myModaltabindex = -  1role =dialogaria-labelledby =myModalLabeldata-backdrop =falsearia-hidden =truedata-keyboard =false> 
< div class =modal-dialogrole =document> 
< div class =modal-content> 
< div class =modal-header> 
< button type =buttonclass =closedata-dismiss =modalaria-label =Close>< span aria-hidden =true>& times;<<< ; /跨度>< /按钮> 
< h4 class =modal-titleid =myModalLabel>模式标题< / h4> 
< / div> 
< div class =modal-body> 
 ... 
< / div> 
< div class =modal-footer> 
< button type =buttonclass =btn btn-defaultdata-dismiss =modal>关闭< / button> 
< button type =buttonclass =btn btn-primary>保存更改< / button> 
< / div> 
< / div> 
< / div> 
< / div> 
  

我想完全禁用背景，并且只有当时的模态应该处于活动状态，例如

我希望下面给出

和这是我得到

试试这个

  $（'＃myModal'）。modal（{backdrop：'static'，keyboard：false }）; 
  

更多资讯这里

I am trying to popup bootstrap 3 modal in my code using below given code

  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="false" aria-hidden="true" data-keyboard="false">
  <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>

I want to disable background completely and only modal should be active at the time, like this

I want like this given below

and this is what I am getting

解决方案

Try This

$('#myModal').modal({backdrop: 'static', keyboard: false})  ;

More Info Here

这篇关于引导程序3在模态弹出后禁用背景的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！