bootstrap 让只有点击按钮时才关闭模态弹窗。

Javascript piniu 905浏览 0评论

因为使用boostrap的模态弹窗,当我们点击弹出以外的浮层是,弹窗就关闭了,这不是我们想要的结果。

很多时候我们想只有点击关闭按钮时,才关闭弹窗。

其实很简单,只要添加 data-backdrop=”static” 代码即可。

<!-- 这是点击按钮 -->
<div class="row">
	<div class="pull-left">
           <button class="btn btn-sm btn-info" data-toggle="modal" data-target="#myAppModal">创建应用</button>
	</div>
</div>
 
<!-- 这是点击按钮后,弹出的模态弹窗 -->
<div class="modal fade" id="myAppModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title" id="myModalLabel">创建应用</h4>
            </div>
            <div class="modal-body">
				这是内容。。。。。
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button id="appInterface" type="button" class="btn btn-primary">提交</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

发表我的评论
取消评论
表情

Hi,您需要填写昵称和邮箱!

  • * 昵称:
  • * 邮箱: