BootstrapDialog：代替boostarp模态框modal的最佳组件

官方客服 2015-12-02 11:09:47

用过Bootstrap的朋友或许知道，其模态框modal用起来并不方便，它需要你写上一堆固定代码，放到html页面里再加以调用，无形中增加了页面体积，大量调用的话更不方便。

bootstrap3-dialog，是用 javascript 重新包装了 bootstrap3 的 modal 组件， 使用更方便更友好！

对于它的介绍，大家可以百度，下面列举一些常用的使用方法：

简单Alert

    BootstrapDialog.alert('Hi Apple!');

自定义Alert

   BootstrapDialog.alert({
    title: 'WARNING',
    message: '这是一个alert对话框',
    type: BootstrapDialog.TYPE_WARNING,     closable: true,
    buttonLabel: '提交',  
    callback: function(result) { 
       window.location.reload(); 
    }
});

普通弹窗

BootstrapDialog.show({
   title: '标题', message: '内容'
});

内容加载页面

BootstrapDialog.show({
   title: '加载url中的内容', message: $('<div></div>').load(url)
});

确认对话框

BootstrapDialog.confirm('确定删除吗？', function(result){
    if(result){
        
    }else{
        
    }
});

延时并自动关闭对话框

BootstrapDialog.show({
    title: '标题',
    message: '提交订单成功，接下来进入支付流程。请稍候，2秒后自动跳转...',
    type: BootstrapDialog.TYPE_SUCCESS, 
    closable : false ,
    onshown: function(dialog) {
        setTimeout(function(){
            window.location = '?shop-pay-orderid-'+orderid+'.htm';
        }, 2000);
    },
});