一、引用
<link href="https://cdn.suziyun.com/alonejs.min.css" rel="stylesheet" /> <script src="https://code.jquery.com/jquery-3.1.0.min.js"></script> <script src="https://cdn.suziyun.com/alonejs.min.js"></script>
二、调用示例
1、弹出基本消息框:
iBox.msgbox("你好!","系统提示");
2、弹出模态消息框:
iBox.msgbox("你好!", "系统提示", { modal: true });
3、弹出带【确定】和【取消】按钮的模态消息框,并设置宽度位为200px:
iBox.msgbox("你好!", "系统提示", function (e) { alert("确定"); }, function (e) { alert("取消"); }, { width: , modal: true });
4、点击【取消】按钮,不让消息框关闭:
iBox.msgbox("你好!", "系统提示", function (e) { alert("确定"); }, function (e) { alert("取消"); return false;//返回false即可不让消息框关闭,同样【确定】按钮也支持。 }, { width: , modal: true });
5、在消息框关闭时执行自定义逻辑:
iBox.msgbox("你好!", "系统提示", function (e) { alert("确定"); }, function (e) { alert("取消"); return false;//返回false即可不让消息框关闭 }, { width: , modal: true, fnClose: function (e) { alert("关闭"); //return false;//如果这里返回false,同样会阻止消息框关闭 } });
6、让消息框弹出后在指定时间后自动关闭,此时不会显示右上角的“x”关闭按钮,以及【确定】和【取消】按钮:
iBox.msgbox("你好!", "系统提示", function (e) { alert("确定"); }, function (e) { alert("取消"); return false;//返回false即可不让消息框关闭 }, { width: , modal: true, fnClose: function (e) { alert("关闭"); }, autoClose: //指定autoClose为1200毫秒,即可让消息框在1200毫秒后自动关闭,关闭时同样会触发fnClose事件。 });
7、在消息框显示完成之后,执行自定义逻辑,例如,在内容里面添加“hello world”两个红色单词:
iBox.msgbox("你好!", "系统提示", function (e) { alert("确定"); }, function (e) { alert("取消"); return false;//返回false即可不让消息框关闭 }, { width: , modal: true, fnClose: function (e) { alert("关闭"); }, fnComplete: function (e) { e.$scope.find('.msgbox-content').append('<span style="color:red">hello world</span>');//这里的e.$scope就是当前消息框的jQuery对象 } });