插件官方地址：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即可。