插件官方地址:http://bootboxjs.com/
alert:
1
|
bootbox.alert(
"Hello world!"
,
function
() {});
|
dialog:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
|
bootbox.dialog({
// dialog的內容
message:
"I am a custom dialog"
,
// dialog的標題
title:
"Custom title"
,
// 退出dialog時的回調函數,包括用戶使用ESC鍵及點擊關閉
onEscape:
function
() {},
// 是否顯示此dialog,默認true
show:
true
,
// 是否顯示body的遮罩,默認true
backdrop:
true
,
// 是否顯示關閉按鈕,默認true
closeButton:
true
,
// 是否動畫彈出dialog,IE10以下版本不支持
animate:
true
,
// dialog的類名
className:
"my-modal"
,
// dialog底端按鈕配置
buttons: {
// 其中一個按鈕配置
success: {
// 按鈕顯示的名稱
label:
"Success!"
,
// 按鈕的類名
className:
"btn-success"
,
// 點擊按鈕時的回調函數
callback:
function
() {}
},
// 另一個按鈕配置
"Danger!"
: {
className:
"btn-danger"
,
callback:
function
() {}
}
}
});
|
默認的modal是固定寬度的,bootbox也不例外,那么如何讓彈出框能自定義寬度呢?我們可以利用上面提到的dialog的className,定義一個class,然后對class設置width即可。