首页 > 代码库 > artDialog4.1.7 摘自网络
artDialog4.1.7 摘自网络
jquery.artDialog.source.js学习
1 关键的对象关系
art = jQuery = $function artDialog() {...}artDialog.fn = artDialog.prototype = artDialog.fn._init.prototypejQuery.fn = jQuery.prototype = jQuery.fn.init.prototypejQuery.extend = jQuery.fn.extend$.fn.dialog = $.fn.artDialogwindow.artDialog = $.dialog = $.artDialog = artDialog
2 默认配置
artDialog.defaults = { // 消息内容 content: ‘<div class="aui_loading"><span>loading..</span></div>‘, title: ‘\u6d88\u606f‘, // 标题. 默认‘消息‘ button: null, // 自定义按钮 ok: null, // 确定按钮回调函数 cancel: null, // 取消按钮回调函数 init: null, // 对话框初始化后执行的函数 close: null, // 对话框关闭前执行的函数 okVal: ‘\u786E\u5B9A‘, // 确定按钮文本. 默认‘确定‘ cancelVal: ‘\u53D6\u6D88‘, // 取消按钮文本. 默认‘取消‘ width: ‘auto‘, // 内容宽度 height: ‘auto‘, // 内容高度 minWidth: 96, // 最小宽度限制 minHeight: 32, // 最小高度限制 padding: ‘20px 25px‘, // 内容与边界填充距离 skin: ‘‘, // 皮肤名(预留接口,尚未实现) icon: null, // 消息图标名称 time: null, // 自动关闭时间 esc: true, // 是否支持Esc键关闭 focus: true, // 是否支持对话框按钮自动聚焦 show: true, // 初始化后是否显示对话框 follow: null, // 跟随某元素(即让对话框在元素附近弹出) path: _path, // artDialog路径 lock: false, // 是否锁屏 background: ‘#000‘, // 遮罩颜色 opacity: .7, // 遮罩透明度 duration: 300, // 遮罩透明度渐变动画速度 fixed: false, // 是否静止定位 left: ‘50%‘, // X轴坐标 top: ‘38.2%‘, // Y轴坐标 zIndex: 1987, // 对话框叠加高度值(重要:此值不能超过浏览器最大限制) resize: true, // 是否允许用户调节尺寸 drag: true // 是否允许用户拖动位置 };
3 获取某对话框
artDialog.get = function (id) { return id === undefined ? artDialog.list : artDialog.list[id];};
iframeTools.source.js学习
var _top = artDialog.top // 引用顶层window对象;artDialog.parent = _top; // 兼容v4.1之前版本,未来版本将删除此;_topDialog = _top.artDialog; // 顶层window对象的artDialog对象;artDialog.data // 跨框架数据共享接口,保存在顶层框架下面;artDialog.through = _proxyDialog // 跨框架普通对话框artDialog.open // 弹出窗口artDialog.open.api // 引用open方法扩展方法artDialog.opener // 引用open方法触发来源页面windowartDialog.open.origin = artDialog.opener; // 兼容v4.1之前版本,未来版本将删除此artDialog.close // 关闭对话框artDialog.alert // 警告对话框artDialog.confirm // 确认对话框artDialog.prompt // 输入提示对话框artDialog.tips // 短暂提示对话框 // 获取源窗口var winOpener = (art.dialog.opener == window) && window.opener || art.dialog.opener;// 关闭窗口var api = art.dialog.open.api;api && api.close() || window.close();
JavaScript闭包写法的优势:隐藏实现细节,不污染window对象;
例如:
// 变量a的获取细节被隐藏,这样不会污染window对象; var a = function() { // do something return 1; }(); // 逻辑表达式特殊应用 a && alert("a=" + a); // 创建自己的API并隐藏了实现细节,这样不会污染window对象; ;(function(p1, p2) { // do something // 将自己的对象赋值到window window.xxx = xxx; alert(p1 + "-" + p2); })(1, 2);
常见的对话框实现
结合iframetools.source.js提供的默认实现;
建议使用时候同时导入jquery.artDialog.source.js和iframetools.source.js,由于默认实现的alert是一个警告消息框,这里可以自己去覆盖掉;
artDialog.shake = function () { var style = this.DOM.wrap[0].style, p = [4, 8, 4, 0, -4, -8, -4, 0], fx = function () { style.marginLeft = p.shift() + ‘px‘; if (p.length <= 0) { style.marginLeft = 0; clearInterval(timerId); }; }; p = p.concat(p.concat(p)); timerId = setInterval(fx, 13); return this;};artDialog.notice = function (options) { var opt = options || {}, api, aConfig, hide, wrap, top, duration = 800; var config = { id: ‘Notice‘, left: ‘100%‘, top: ‘100%‘, fixed: true, drag: false, resize: false, follow: null, lock: false, init: function(here){ api = this; aConfig = api.config; wrap = api.DOM.wrap; top = parseInt(wrap[0].style.top); hide = top + wrap[0].offsetHeight; wrap.css(‘top‘, hide + ‘px‘) .animate({top: top + ‘px‘}, duration, function () { opt.init && opt.init.call(api, here); }); }, close: function(here){ wrap.animate({top: hide + ‘px‘}, duration, function () { opt.close && opt.close.call(this, here); aConfig.close = $.noop; api.close(); }); return false; } }; for (var i in opt) { if (config[i] === undefined) config[i] = opt[i]; }; return artDialog.through(config);};artDialog.alert = function (content, callback) { return artDialog.through({ id: ‘Alert‘, fixed: true, content: content, ok: true, close: callback });};artDialog.warn = function (content, callback) { return artDialog.through({ id: ‘Warn‘, title: ‘警告‘, icon: ‘warning‘, fixed: true, lock: true, content: content, ok: true, close: callback });};
artDialog4.1.7 摘自网络
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。