博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
bootstrapt model 的多罩层,禁用罩层
阅读量:6096 次
发布时间:2019-06-20

本文共 1225 字,大约阅读时间需要 4 分钟。

          

选项

有一些选项可以用来定制模态窗口(Modal Window)的外观和感观,它们是通过 data 属性或 JavaScript 来传递的。下表列出了这些选项:

选项名称 类型/默认值 Data 属性名称 描述
backdrop boolean 或 string 'static'
默认值:true
data-backdrop 指定一个静态的背景,当用户点击模态框外部时不会关闭模态框。
keyboard boolean
默认值:true
data-keyboard 当按下 escape 键时关闭模态框,设置为 false 时则按键无效。
show boolean
默认值:true
data-show 当初始化时显示模态框。
remote path
默认值:false
data-remote 使用 jQuery .load 方法,为模态框的主体注入内容。如果添加了一个带有有效 URL 的 href,则会加载其中的内容。如下面的实例所示:
请点击我

方法

 

模态弹出窗还支持四种类型的事件,分别是模态弹出窗的弹出前、弹出后,关闭前、关闭后,具体描述如下:

事件类型

描述

show.bs.modal

在show方法调用时立即触发(尚未显示之前);如果单击了一个元素,那么该元素将作为事件的relatedTarget属性

shown.bs.modal

该事件在模态弹出窗完全显示给用户之后(并且等CSS动画完成之后)触发;如果单击了一个元素,那么该元素将作为事件的relatedTarget事件

hide.bs.modal

在hide方法调用时(但还未关闭隐藏)立即触发

hidden.bs.modal

该事件在模态弹出窗完全隐藏之后(并且CSS动画漂完成之后)触发

  

        $('#myModal03').on('show.bs.modal', function () {

        $('.modal-backdrop').css({ "z-index": "1060" });
          })
        $('#myModal03').on('hide.bs.modal', function () {
        $('.modal-backdrop').css({ "z-index": "999" })
        })

BootStrap 模态框禁用空白处点击关闭

模态框为信息编辑窗口,涉及好多内容,填了半天,若一不小心点了空白处.....

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

backdrop:static时,空白处不关闭.

keyboard:false时,esc键盘不关闭.

转载于:https://www.cnblogs.com/chongtao/p/5823140.html

你可能感兴趣的文章
Storm 编程入门
查看>>
《学习OpenCV》第三章练习(参考代码)第2题
查看>>
redis的持久化方式
查看>>
Java面试题---代码题
查看>>
Python如何操作数据库?Python基础教程,第十四讲,数据库支持
查看>>
Git 删除远程仓库文件,并忽略提交文件
查看>>
win 2003 ftp
查看>>
我的友情链接
查看>>
Linux之命令学习小记
查看>>
Linux下各文件夹的含义及解释
查看>>
使用装饰器时带括号与不带括号的区别
查看>>
Android架构和特征
查看>>
第五十一课 NoSQL基础概念及MongoDB应用、数据库分配概念
查看>>
nginx 安装部署
查看>>
2012年的十一长假,一些想记录下来的情节
查看>>
linux命令--cal
查看>>
Axure 8.1.0.3381注册码
查看>>
awk数组、函数、脚本
查看>>
Win32项目与控制台应用的区别
查看>>
Unicode之痛
查看>>