artDialog-学习课程（二）-常用弹出框

 

 

常用弹出框

 

示例1  content传入字符串

 

art.dialog({
    content: 'Hello word'
});

 

 

示例2 content 传入HTMLElement

 

art.dialog({
    content: $("#myid").html(),
    id: 'EF893L'
});

 

示例3 创建一个右下角浮动的消息窗口

 

art.dialog({
    id: 'msg',
    title: '公告',
    content: 'hello world!',
    width: 320,
    height: 240,
    left: '100%',
    top: '100%',
    fixed: true,
    drag: false,
    resize: false
})

 

 

 示例4 静止定位

 

art.dialog({
    fixed: true,//开启静止定位
    content: '请拖动滚动条查看'
});

 

 

示例5 展示图片或视频

 

art.dialog({
    padding: 0,
    title: '照片',
    content: '<img src="./images/photo.jpg" width="379" height="500" />',
    lock: true
});

 

 

示例6 引入页面

 

      art.dialog.open('/Manager/Contract/ServiceEdit.aspx?flag=bj&id=' + id, {
                title: "服务设备信息",
                width: 800,
                height: 400,
                lock: true,
                cancelVal: '关闭',
                opacity: 0.1,
                cancel: true
      });

 

 

示例7 确认框

/**
* 确认
* @param {String}消息内容
* @param {Function}确定button回调函数
* @param {Function}取消button回调函数
*/
artDialog.confirm = function (content, yes, no) {
    return artDialog({
        id: 'Confirm',
        icon: 'question',
        fixed: true,
        // lock: true,
        opacity: .1,
        width: 250,
        height: 105,
        content: content,
        ok: function (here) {
            return yes.call(this, here);
        },
        cancel: function (here) {
            return no && no.call(this, here);
        }
    });
};

 

调用

        art.dialog.confirm('你确定要作废这个合同吗？', function () {
            art.dialog.tips('运行确定操作');
        }, function () {
            art.dialog.tips('运行取消操作');
        });

 

 

 

下一篇介绍下artDialog 参数配置下，了解熟悉artDialog参数配置下，基本上就上手了