data-参数说明(模态弹出窗的使用)
除了通过data-toggle和data-target来控制模态弹出窗之外,Bootstrap框架针对模态弹出框还提供了其他自定义data-属性,来控制模态弹出窗。比如说:是否有灰色背景modal-backdrop,是否可以按ESC键关闭模态弹出窗。有关于Modal弹出窗自定义属性相关说明如下所示:
JavaScript触发时的参数设置
$(function(){
$(".btn").click(function(){
$("#mymodal").modal({
backdrop:false,
keyboard:false});
});
});
参数设置:
在Bootstrap框架中还为模态弹出窗提供了三种参数设置,具体说明如下:
事件设置:
模态弹出窗还支持四种类型的事件,分别是模态弹出窗的弹出前、弹出后,关闭前、关闭后,具体描述如下
$(function(){
$(".btn").click(function(){
$("#mymodal").modal("toggle");
});
$('#mymodal').on('show.bs.modal', function (e) {
alert("在show方法调用时立即触发(尚未显示之前);如果单击了一个元素,那么该元素将作为事件的relatedTarget属性");
});
$('#mymodal').on('shown.bs.modal', function (e) {
alert("该事件在模态弹出窗完全显示给用户之后(并且等CSS动画完成之后)触发;如果单击了一个元素,那么该元素将作为事件的relatedTarget事件");
});
$('#mymodal').on('hide.bs.modal', function (e) {
alert("在hide方法调用时(但还未关闭隐藏)立即触发");
});
$('#mymodal').on('hidden.bs.modal', function (e) {
alert("该事件在模态弹出窗完全隐藏之后(并且CSS动画漂完成之后)触发");
});
});
最新文章
- decode()函数
- java.util.concurrent.atomic 包详解
- 让 “微软雅黑” 在IE6下完美显示
- mysql memory表性能测试以及使用场景
- Java内存分配
- 关于Android M RuntimePermission的问题
- java.lang.NoSuchFieldError: INSTANCE
- Notepad++使用技法
- sql语句查询数据库中的表名/列名/主键/自动增长值
- 通过扩展改善ASP.NET MVC的验证机制[实现篇]
- Linux sort -g 的困惑
- hdu4027 开方,记录
- JavaScript 数组对象的去重
- Excel 2010高级应用-饼图(四)
- 使用SQL-Front启动MySQL8.0报错
- 树莓派(Raspberry Pi 3)安装centos7后yum无法使用解决办法
- oracle 分组函数执行分析
- FFmpeg 裁剪——音频解码
- 如何在web api中使用SignalR
- vue需要注意的事宜