一、引用
<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>
二、调用示例
AloneJs.albumBox(function (images) { // todo});
三、函数原型
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”页面的内容即为下图内容: