Skip to content
文章目录

说明

根据bootstrap官方组件modal封装的一个弹层插件

用法

javascript
$.modal({
    body: '这是一个简单的alert框',
})

选项

选项类型默认值说明
btnCancelTextString'取消'取消按钮的文本
btnCancelClassString'btn-light'取消按钮的class
btnOKTextString'确定'ok按钮的文本
btnOKClassString'btn-primary'ok按钮的class
okFunctionnullok按钮的回调
cancelBtnBooleanfalse是否显示取消按钮,默认不显示
cancelFunctionnull取消按钮的回调
titleString''模态框的标题,url参数不为空且title为'',则title为url路径
bodyString''模态框的内容部分
btnAlignString'right'底部按钮区域对齐方式
btnSizeString''底部按钮区域的大小统一设置
buttonsArraynull如果设置为 [] 则表示底部按钮区域不显示,数组的元素是对象
modalClassString'fade'".modal"所在div修饰类 比如:fade
modalDialogClassString'modal-dialog-centered modal-sm'".modal-dialog"所在div修饰类 比如:modal-dialog-scrollable modal-dialog-centered modal-dialog-scrollable
modalOptions{}{ backdrop: true, keyboard: true, focus: true }bootstrap模态框选项参考:https://getbootstrap.com/docs/5.3/components/modal/#options
urlString''iframe的src路径,设置后会覆盖body参数
onShowFunctionnullshow调用实例方法时会立即触发此事件
onShownFunctionnull当动画完全执行完毕时触发此事件
onHideFunctionnullhide调用实例方法时会立即触发此事件。
onHiddenFunctionnull当模态框完成对用户隐藏时会触发此事件

案例

alert

html
dsasda

confirm

html
dsasda

TIP

确认框用的频率特别高,这里特别封装了一个简约用法,免配置快速生成一个confirm框

html
dsasda

prompt

iframe弹层

Released under the MIT License.