AloneJs.albumBox() —— 相册对话框

标签：

一、引用

<link href="http://alonejs.suziyun.com:8080/alonejs.min.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="http://alonejs.suziyun.com:8080/alonejs.min.js"></script>

二、调用示例

AloneJs.albumBox = function (fnOK) {
    iBox.show({
        title: "选择图片",
        width: 705,
        height: 425,
        modal: true,
        content: function (e) {
            var $el = e.$scope; //获取对话框的jQuery对象
            AloneJs($el).showLoader(); //显示加载进度条
            $.ajax({
                url: ‘/product/album.html‘,
                type: ‘GET‘,
                data: {
                    m: false
                },
                success: function (data) {
                    if (data) {
                        $el.html(data); //将异步请求的html内容显示在对话框中
                        e.window.adjustPosition(); //重新调整对话框的位置
                    }
                    AloneJs($el).closeLoader(); //关闭进度条
                }
            });
        },
        buttons: [
            {
                text: "取消"
            },
            {
                text: "确定",
                focus: true,
                fn: function (e) {
                    var $win = e.$scope,
                        images = []; //定义数组记录选中的图片地址
                    //获取选中的图片
                    $win.find(‘.sl-album-photolist .photo-item-mask‘).each(function () {
                        var image = $(this).parent().attr("data-image");
                        if (image && image.length > 0) {
                            images.push(image);
                        }
                    });
                    if (images.length > 0) {
                        //执行回调函数，并将选中的图片数组作为参数传入回调函数
                        if ($.type(fnOK) == "function") {
                            fnOK(images);
                        }
                    } else {
                        iBox.msgbox("请选择一张图片！", { autoClose: 1200, modal: true });
                        return false;
                    }
                }
            }
        ]
    });
};

 其中，异步请求“/product/album.html”页面的内容即为下图内容：

AloneJs.albumBox() —— 相册对话框

标签：

原文地址：http://www.cnblogs.com/suqier/p/albumbox.html