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常用参数、方法和事件的更多相关文章

  1. bootstrap modal 监听滚动条事件

    bootstrap modal 里面使用datetimepicker时间控件,滚动时,时间控件并不会隐藏,这是一个小bug,在组里改下,当滚动条滚动时,直接隐藏这个时间控件,$("#alar ...

  2. 在bootstrap modal 中加载百度地图的信息窗口失效解决方法

    这个问题其实很傻,解决方法没有任何技术含量,只是记录下工作中发生的事. 前阵子给一个汽车集团客户做了一个经销商查询系统,其中一个功能是使用地图标注经销商店面地址,并且实现导航功能. 页面演示地址:ht ...

  3. Bootstrap modal使用及点击外部不消失的解决方法

    这篇文章主要为大家详细介绍了Bootstrap modal使用及点击外部不消失的解决方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 本文实例为大家分享了Bootstrap modal使用及点击 ...

  4. bootstrap datepicker 属性设置 以及方法和事件

    DatePicker支持鼠标点选日期,同时还可以通过键盘控制选择: page up/down - 上一月.下一月 ctrl+page up/down - 上一年.下一年 ctrl+home - 当前月 ...

  5. express模块中的req,res参数的常用属性方法

    express模块中的req,res参数的常用属性方法 const express = require('express'); const router = express.Router() rout ...

  6. 大数据学习day13------第三阶段----scala01-----函数式编程。scala以及IDEA的安装,变量的定义,条件表达式,for循环(守卫模式,推导式,可变参数以及三种遍历方式),方法定义,数组以及集合(可变和非可变),数组中常用的方法

    具体见第三阶段scala-day01中的文档(scala编程基础---基础语法)  1. 函数式编程(https://www.cnblogs.com/wchukai/p/5651185.html): ...

  7. bootstrap插件学习-bootstrap.modal.js

    bootstrap插件学习-bootstrap.modal.js 先从bootstrap.modal.js的结构看起. function($){ var Modal = function(){} // ...

  8. bootstrap modal 垂直居中对齐

    bootstrap modal 垂直居中对齐   文章参考 http://www.bubuko.com/infodetail-666582.html http://v3.bootcss.com/Jav ...

  9. jvm常用参数设置 专题

    在jdk8中 -Xms2g不合法,能通过的:-Xms2G #!/bin/bash JAVA_OPTS="-Xms4G -Xmx4G -XX:+HeapDumpOnOutOfMemoryErr ...

随机推荐

  1. [Oracle维护工程师手记]为什么flashback 的时候既需要 flashback log ,又需要 archive log?

    为什么flashback 的时候既需要 flashback log ,又需要 archive log 呢? 如果数据库的活动不是很频繁,可以看到,其flashback log 是比较小的.那么是通过怎 ...

  2. Educational Codeforces Round 62 (Rated for Div. 2) - C Playlist

    当时题意看错了...不过大致思路是对的,唯一没有想到的就是用优先队列搞这个东西,真是不该啊... 题意大概就是,有N首歌,N首歌有两个东西,一个是长度Ti,一个是美丽值Bi,你最多可以选择K首歌, 这 ...

  3. pyspider安装出现问题参考

    File "c:\users\13733\appdata\local\programs\python\python37\lib\site-packages\pyspider\run.py&q ...

  4. vue 使用微信JSSDK,在IOS端会授权出错

    原因: vue-router切换的时候操作的都是浏览器的历史记录,iOS会把第一次刚进入时的URL作为真实URL,安卓会把当前URL作为真实URL. 所以导致后端在配置好的授权参数获得的config参 ...

  5. Java 常用数据结构对象的实现原理 集合类 List Set Map 哪些线程安全 (美团面试题目)

    Java中的集合包括三大类,它们是Set.List和Map, 它们都处于java.util包中,Set.List和Map都是接口,它们有各自的实现类. List.Set都继承自Collection接口 ...

  6. RfcConfig 类 主要解决Tomcat 报 The valid characters are defined in RFC 7230 and RFC 3986

    tomcat 8.0以后对请求URL做了严格的过滤 就是严格按照 RFC 3986规范进行访问解析,而 RFC 3986规范定义了Url中只允许包含英文字母(a-zA-Z).数字(0-9).-_.~4 ...

  7. 转 - mybatis中${}、 #{}区别及应用场景

    转与 https://www.jianshu.com/p/bbeff97d41eb 动态sql是mybatis的主要特性之一.在mapper中定义的参数传到xml中之后,在查询之前mybatis会对其 ...

  8. Python——入门 | 常用python实现

    一.冒泡排序 list = [56,12,1,8,354,10,100,34,56,7,23,456,234,-58] def MP_paixu(): for i in range(len(list) ...

  9. Codeforces Round #513 总结

    首次正式的$Codeforces$比赛啊,虽然滚粗了,然而终于有$rating$了…… #A  Phone Numbers 签到题,然而我第一次写挂了(因为把11看成8了……) 只需要判断一下有多少个 ...

  10. LOJ #2719. 「NOI2018」冒泡排序(组合数 + 树状数组)

    题意 给你一个长为 \(n\) 的排列 \(p\) ,问你有多少个等长的排列满足 字典序比 \(p\) 大 : 它进行冒泡排序所需要交换的次数可以取到下界,也就是令第 \(i\) 个数为 \(a_i\ ...