Bootstrap modal常用参数、方法和事件
Bootstrap modal(模态窗)常用参数、方法和事件:
参数:
|
名称 |
类型 |
默认值 |
描述 |
|
Backdrop |
Boolean或字符串“static” |
True |
True:有背景,点击modal外部,modal消失。 False:无背景,点击modal外部,modal不消失。 Static:有背景,点击modal外部,modal不消失。 |
|
Keyboard |
Boolean |
True |
True:键盘上的esc按下关闭modal False:键盘上的esc按下不关闭modal |
|
Show |
Boolean |
True |
True:显示modal False:不显示modal |
方法:
.modal(options)
将页面中的某内容作为模态窗激活。接受可选的参数object;
$(“#myModal”).modal();默认无参数
$(“#myModal”).modal({keyboard:false})
.modal(“toggle”)
手动打开或关闭模态窗。
$(“#myModal”).modal(“toggle”)
.modal(“show”)
手动打开模态窗
$(“myModal”).modal(“show”);
.modal(“hide”)
手动关闭模态窗
$(“myModal”).modal(“hide”);
事件:
|
事件类型 |
描述 |
|
Show.bs.modal |
Show方法调用之后立即出发该事件,如果是通过点击某个作为触发器的元素,则此元素可以通过事件的realatedTarget属性进行访问。 |
|
Shown.bs.modal |
此事件在模态窗已经显示出来(并且同事在css过度效果完成)之后出发,如果通过点击某个作为触发器的元素,则此元素可以通过事件的relatedTarget属性进行访问。 |
|
Hide.bs.modal |
Hide方法调用之后立即出发该事件 |
|
Hidden.bs.modal |
此事件在模态窗被隐藏(并且同时在css过渡效果完成)之后出发 |
|
Loaded.bs.modal |
从远端的数据源加载完数据之后出发该事件 |
事件调用示例:
$(“#myModal”).on(“show.bs.modal”,function(e){
//do something ……
});
Bootstrap modal常用参数、方法和事件的更多相关文章
- bootstrap modal 监听滚动条事件
bootstrap modal 里面使用datetimepicker时间控件,滚动时,时间控件并不会隐藏,这是一个小bug,在组里改下,当滚动条滚动时,直接隐藏这个时间控件,$("#alar ...
- 在bootstrap modal 中加载百度地图的信息窗口失效解决方法
这个问题其实很傻,解决方法没有任何技术含量,只是记录下工作中发生的事. 前阵子给一个汽车集团客户做了一个经销商查询系统,其中一个功能是使用地图标注经销商店面地址,并且实现导航功能. 页面演示地址:ht ...
- Bootstrap modal使用及点击外部不消失的解决方法
这篇文章主要为大家详细介绍了Bootstrap modal使用及点击外部不消失的解决方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 本文实例为大家分享了Bootstrap modal使用及点击 ...
- bootstrap datepicker 属性设置 以及方法和事件
DatePicker支持鼠标点选日期,同时还可以通过键盘控制选择: page up/down - 上一月.下一月 ctrl+page up/down - 上一年.下一年 ctrl+home - 当前月 ...
- express模块中的req,res参数的常用属性方法
express模块中的req,res参数的常用属性方法 const express = require('express'); const router = express.Router() rout ...
- 大数据学习day13------第三阶段----scala01-----函数式编程。scala以及IDEA的安装,变量的定义,条件表达式,for循环(守卫模式,推导式,可变参数以及三种遍历方式),方法定义,数组以及集合(可变和非可变),数组中常用的方法
具体见第三阶段scala-day01中的文档(scala编程基础---基础语法) 1. 函数式编程(https://www.cnblogs.com/wchukai/p/5651185.html): ...
- bootstrap插件学习-bootstrap.modal.js
bootstrap插件学习-bootstrap.modal.js 先从bootstrap.modal.js的结构看起. function($){ var Modal = function(){} // ...
- bootstrap modal 垂直居中对齐
bootstrap modal 垂直居中对齐 文章参考 http://www.bubuko.com/infodetail-666582.html http://v3.bootcss.com/Jav ...
- jvm常用参数设置 专题
在jdk8中 -Xms2g不合法,能通过的:-Xms2G #!/bin/bash JAVA_OPTS="-Xms4G -Xmx4G -XX:+HeapDumpOnOutOfMemoryErr ...
随机推荐
- 【洛谷】【二分答案+最短路】P1462 通往奥格瑞玛的道路
在艾泽拉斯大陆上有一位名叫歪嘴哦的神奇术士,他是部落的中坚力量 有一天他醒来后发现自己居然到了联盟的主城暴风城 在被众多联盟的士兵攻击后,他决定逃回自己的家乡奥格瑞玛 题目背景 [题目描述:] 在艾泽 ...
- FineUIPro v5.1.0 发布了!
FineUIPro v5.1.0 已发布,这已经是自 2014 年以来的第 31 个版本,4 年来精雕细琢,只为你来! 上个大版本新增了响应式布局,而这个版本主要是BUG修正,此外还增加了树控件的级联 ...
- Spring+SpringMVC+Hibernate小案例(实现Spring对Hibernate的事务管理)
原文地址:https://blog.csdn.net/jiegegeaa1/article/details/81975286 一.工作环境 编辑器用的是MyEclipse,用Mysql数据库,mave ...
- C#后台发布
测试环境:... 生产环境:发布--文件系统--Release--本地文件--成功copy服务器上:(第一次发布vue项目前后端copy顺序,避免一些bug)
- openstack搭建之-keystone配置(8)
一. Base Node配置 mysql -uroot -proot CREATE DATABASE keystone GRANT ALL PRIVILEGES ON keystone.* to 'k ...
- python xlwt模块生成excel文件并写入数据 xlrd读取数据
python中一般使用 xlwt (excel write)来生成Excel文件(可以控制单元格格式),用 xlrd 来读取Excel文件,用xlrd读取excel是不能对其进行操作的. 1.xlrd ...
- MySQL——修改数据库远程权限
语句 赋予权限 ON *.*前一个*代表库后一个代表表 GRANT ALL PRIVILEGES ON *.* TO 'root'@'%' IDENTIFIED BY 'xxxxx' WITH GRA ...
- P3389 【模板】高斯消元法
高斯消元求解n元一次线性方程组的板子题: 先举个栗子: • 2x + y - z = 8-----------① •-3x - y + 2z = -11---------② •-2x + y + ...
- BBS 502 BadGateway 原因分析
说明: LNMP架构. crontab里有每隔20分钟重启php的任务:然后我用python写了个每1分钟检测php-cgi进程是否存在的脚本,如果不存在则调用重启php的脚本,并邮件通知管理员.cr ...
- 用Pytorch训练MNIST分类模型
本次分类问题使用的数据集是MNIST,每个图像的大小为\(28*28\). 编写代码的步骤如下 载入数据集,分别为训练集和测试集 让数据集可以迭代 定义模型,定义损失函数,训练模型 代码 import ...