zoukankan      html  css  js  c++  java
  • bootstrap 弹出框点击其他区域时弹出框不消失选项设置

    默认情况下,bootstrap 弹出框点击其他区域时,弹出框会自动关闭,在很多时候,我们可能会希望达到和原生弹出框一样的效果,避免不小心点击其他区域时弹框自动隐藏,尤其是对于一些复杂的表单,重复填写可能会带来很不好的体验效果,所以,我们会希望不会发生这种情况,事实上bootstrap dialog提供了大量的选项可以设置各种dialog的行为和效果。如下所示:

    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="">
    <div class="modal-content">
    <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
    <h4 class="modal-title" id="myModalLabel">新增</h4>
    </div>
    <div class="modal-body">
                </div>
    <div class="modal-footer">
    <button type="button" id="btn_submit" class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>保存</button>
    <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>关闭</button>
    </div>
    </div>
    </div>
    </div>
    $("#add").click(function () {
    $("#myModalLabel").text("新增");
    $('#myModal').modal({backdrop:"static"}); --设置为static后可以防止不小心点击其他区域是弹出框消失
    });
    其他更多选项可见http://www.runoob.com/bootstrap/bootstrap-modal-plugin.html
  • 相关阅读:
    jQuery加载
    2.第一个flask web程序
    [转]前端懒加载以及预加载
    [转]当你在浏览器中输入 google.com 并且按下回车之后发生了什么?
    [转]如何让在FLASH不浮动在层之上
    逻辑回归基础梳理
    线性回归基础梳理
    [傻瓜式一步到位] 阿里云服务器Centos上部署一个Flask项目
    Java学习之"Hello World"
    JDK安装及Java环境变量配置
  • 原文地址:https://www.cnblogs.com/zhjh256/p/5966351.html
Copyright © 2011-2022 走看看