首页 > 代码库 > Bootstrap modal常用参数、方法和事件

Bootstrap modal常用参数、方法和事件

2024-10-12 04:16:01   218人阅读

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常用参数、方法和事件


联系
我们