封装方法到对象(javascript)
/*!
* artDialog 5
* Date: 2012-03-21
* http://code.google.com/p/artdialog/
* (c) 2009-2012 TangBin, http://www.planeArt.cn
*
* This is licensed under the GNU LGPL, version 2.1 or later.
* For details, see: http://creativecommons.org/licenses/LGPL/2.1/
*/ ;(function (window, undefined) { var $ = window.art = function (selector, context) {
return new $.fn.constructor(selector, context);
},
quickExpr = /^(?:[^<]*(<[\w\W]+>)[^>]*$|#([\w\-]+)$)/,
rclass = /[\n\t]/g; if (window.$ === undefined) {
window.$ = $;
}; $.fn = $.prototype = { constructor: function (selector, context) {
var match, elem;
context = context || document; if (!selector) {
return this;
}; if (selector.nodeType) {
this[0] = selector;
return this;
}; if (typeof selector === 'string') {
match = quickExpr.exec(selector); if (match && match[2]) {
elem = context.getElementById(match[2]);
if (elem && elem.parentNode) this[0] = elem;
return this;
};
}; this[0] = selector;
return this;
}, /**
* 判断样式类是否存在
* @param {String} 名称
* @return {Boolean}
*/
hasClass: function (name) {
var className = ' ' + name + ' '; if ((' ' + this[0].className + ' ').replace(rclass, ' ').indexOf(className) > -1) {
return true;
}; return false;
}, /**
* 添加样式类
* @param {String} 名称
*/
addClass: function (name) {
if (!this.hasClass(name)) {
this[0].className += ' ' + name;
}; return this;
}, /**
* 移除样式类
* @param {String} 名称
*/
removeClass: function (name) {
var elem = this[0]; if (!name) {
elem.className = '';
} else
if (this.hasClass(name)) {
elem.className = elem.className.replace(name, ' ');
}; return this;
}, /**
* 读写样式<br />
* css(name) 访问第一个匹配元素的样式属性<br />
* css(properties) 把一个"名/值对"对象设置为所有匹配元素的样式属性<br />
* css(name, value) 在所有匹配的元素中,设置一个样式属性的值<br />
*/
css: function (name, value) {
var i, elem = this[0], obj = arguments[0]; if (typeof name === 'string') {
if (value === undefined) {
return $.css(elem, name);
} else {
elem.style[name] = value;
};
} else {
for (i in obj) {
elem.style[i] = obj[i];
};
}; return this;
}, /** 显示元素 */
show: function () {
return this.css('display', 'block');
}, /** 隐藏元素 */
hide: function () {
return this.css('display', 'none');
}, /**
* 获取相对文档的坐标
* @return {Object} 返回left、top的数值
*/
offset: function () {
var elem = this[0],
box = elem.getBoundingClientRect(),
doc = elem.ownerDocument,
body = doc.body,
docElem = doc.documentElement,
clientTop = docElem.clientTop || body.clientTop || 0,
clientLeft = docElem.clientLeft || body.clientLeft || 0,
top = box.top + (self.pageYOffset || docElem.scrollTop) - clientTop,
left = box.left + (self.pageXOffset || docElem.scrollLeft) - clientLeft; return {
left: left,
top: top
};
}, /**
* 读写HTML - (不支持文本框)
* @param {String} 内容
*/
html: function (content) {
var elem = this[0]; if (content === undefined) return elem.innerHTML;
$.cleanData(elem.getElementsByTagName('*'));
elem.innerHTML = content; return this;
}, /**
* 移除节点
*/
remove: function () {
var elem = this[0]; $.cleanData(elem.getElementsByTagName('*'));
$.cleanData([elem]);
elem.parentNode.removeChild(elem); return this;
}, /**
* 事件绑定
* @param {String} 类型
* @param {Function} 要绑定的函数
*/
bind: function (type, callback) {
$.event.add(this[0], type, callback);
return this;
}, /**
* 移除事件
* @param {String} 类型
* @param {Function} 要卸载的函数
*/
unbind: function(type, callback) {
$.event.remove(this[0], type, callback);
return this;
} }; $.fn.constructor.prototype = $.fn; /** 检测window */
$.isWindow = function (obj) {
return obj && typeof obj === 'object' && 'setInterval' in obj;
}; /**
* 搜索子元素
* 注意:只支持nodeName或.className的形式,并且只返回第一个元素
* @param {String}
*/
$.fn.find = function (expr) {
var value, elem = this[0],
className = expr.split('.')[1]; if (className) {
if (document.getElementsByClassName) {
value = elem.getElementsByClassName(className);
} else {
value = getElementsByClassName(className, elem);
};
} else {
value = elem.getElementsByTagName(expr);
}; return $(value[0]);
};
function getElementsByClassName (className, node, tag) {
node = node || document;
tag = tag || '*';
var i = 0,
j = 0,
classElements = [],
els = node.getElementsByTagName(tag),
elsLen = els.length,
pattern = new RegExp("(^|\\s)" + className + "(\\s|$)"); for (; i < elsLen; i ++) {
if (pattern.test(els[i].className)) {
classElements[j] = els[i];
j ++;
};
};
return classElements;
}; /**
* 遍历
* @param {Object}
* @param {Function}
*/
$.each = function (obj, callback) {
var name, i = 0,
length = obj.length,
isObj = length === undefined; if (isObj) {
for (name in obj) {
if (callback.call(obj[name], name, obj[name]) === false) {
break;
};
};
} else {
for (
var value = obj[0];
i < length && callback.call(value, i, value) !== false;
value = obj[++i]
) {};
}; return obj;
}; /**
* 读写缓存
* @param {HTMLElement} 元素
* @param {String} 缓存名称
* @param {Any} 数据
* @return {Any} 如果无参数data则返回缓存数据
*/
$.data = function (elem, name, data) {
var cache = $.cache,
id = uuid(elem); if (name === undefined) {
return cache[id];
}; if (!cache[id]) {
cache[id] = {};
}; if (data !== undefined) {
cache[id][name] = data;
}; return cache[id][name];
}; /**
* 删除缓存
* @param {HTMLElement} 元素
* @param {String} 缓存名称
*/
$.removeData = function (elem, name) {
var empty = true,
expando = $.expando,
cache = $.cache,
id = uuid(elem),
thisCache = id && cache[id]; if (!thisCache) {
return;
}; if (name) { delete thisCache[name];
for (var n in thisCache) {
empty = false;
}; if (empty) {
delete $.cache[id];
}; } else { delete cache[id]; if (elem.removeAttribute) {
elem.removeAttribute(expando);
} else {
elem[expando] = null;
}; };
}; $.uuid = 0;
$.cache = {};
$.expando = '@cache' + + new Date; // 标记元素唯一身份
function uuid (elem) {
var expando = $.expando,
id = elem === window ? 0 : elem[expando];
if (id === undefined) elem[expando] = id = ++ $.uuid;
return id;
}; /**
* 事件机制
* @namespace
* @requires [$.data, $.removeData]
*/
$.event = { /**
* 添加事件
* @param {HTMLElement} 元素
* @param {String} 事件类型
* @param {Function} 要添加的函数
*/
add: function (elem, type, callback) {
var cache, listeners,
that = $.event,
data = $.data(elem, '@events') || $.data(elem, '@events', {}); cache = data[type] = data[type] || {};
listeners = cache.listeners = cache.listeners || [];
listeners.push(callback); if (!cache.handler) {
cache.elem = elem;
cache.handler = that.handler(cache); elem.addEventListener
? elem.addEventListener(type, cache.handler, false)
: elem.attachEvent('on' + type, cache.handler);
};
}, /**
* 卸载事件
* @param {HTMLElement} 元素
* @param {String} 事件类型
* @param {Function} 要卸载的函数
*/
remove: function (elem, type, callback) {
var i, cache, listeners,
that = $.event,
empty = true,
data = $.data(elem, '@events'); if (!data) {
return;
}; if (!type) {
for (i in data) that.remove(elem, i);
return;
}; cache = data[type]; if (!cache) {
return;
}; listeners = cache.listeners;
if (callback) {
for (i = 0; i < listeners.length; i ++) {
listeners[i] === callback && listeners.splice(i--, 1);
};
} else {
cache.listeners = [];
}; if (cache.listeners.length === 0) {
elem.removeEventListener
? elem.removeEventListener(type, cache.handler, false)
: elem.detachEvent('on' + type, cache.handler); delete data[type];
cache = $.data(elem, '@events'); for (var n in cache) {
empty = false;
}; if (empty) {
$.removeData(elem, '@events');
};
};
}, /** @inner 事件句柄 */
handler: function (cache) {
return function (event) {
event = $.event.fix(event || window.event);
for (var i = 0, list = cache.listeners, fn; fn = list[i++];) {
if (fn.call(cache.elem, event) === false) {
event.preventDefault();
event.stopPropagation();
};
};
};
}, /** @inner Event对象兼容处理 */
fix: function (event) {
if (event.target) {
return event;
}; var eventObj = {
target: event.srcElement || document,
preventDefault: function () {event.returnValue = false},
stopPropagation: function () {event.cancelBubble = true}
}; // IE6/7/8 在原生window.event对象写入数据会导致内存无法回收,应当采用拷贝
for (var i in event) {
eventObj[i] = event[i];
} return eventObj;
} }; /**
* 清理元素集的事件与缓存
* @requires [$.removeData, $.event]
* @param {HTMLCollection} 元素集
*/
$.cleanData = function (elems) {
var i = 0, elem,
len = elems.length,
removeEvent = $.event.remove,
removeData = $.removeData; for (; i < len; i ++) {
elem = elems[i];
removeEvent(elem);
removeData(elem);
};
}; // 获取css
$.css = 'defaultView' in document && 'getComputedStyle' in document.defaultView ?
function (elem, name) {
return document.defaultView.getComputedStyle(elem, false)[name];
} :
function (elem, name) {
return elem.currentStyle[name] || '';
}; /**
* 获取滚动条位置 - [不支持写入]
* $.fn.scrollLeft, $.fn.scrollTop
* @example 获取文档垂直滚动条:$(document).scrollTop()
* @return {Number} 返回滚动条位置
*/
$.each(['Left', 'Top'], function (i, name) {
var method = 'scroll' + name; $.fn[method] = function () {
var elem = this[0], win; win = getWindow(elem);
return win ?
('pageXOffset' in win) ?
win[i ? 'pageYOffset' : 'pageXOffset'] :
win.document.documentElement[method] || win.document.body[method] :
elem[method];
};
}); function getWindow (elem) {
return $.isWindow(elem) ?
elem :
elem.nodeType === 9 ?
elem.defaultView || elem.parentWindow :
false;
}; /**
* 获取窗口或文档尺寸 - [只支持window与document读取]
* @example
获取文档宽度:$(document).width()
获取可视范围:$(window).width()
* @return {Number}
*/
$.each(['Height', 'Width'], function (i, name) {
var type = name.toLowerCase(); $.fn[type] = function (size) {
var elem = this[0];
if (!elem) {
return size == null ? null : this;
}; return $.isWindow(elem) ?
elem.document.documentElement['client' + name] || elem.document.body['client' + name] :
(elem.nodeType === 9) ?
Math.max(
elem.documentElement['client' + name],
elem.body['scroll' + name], elem.documentElement['scroll' + name],
elem.body['offset' + name], elem.documentElement['offset' + name]
) : null;
}; }); return $}(window)); ;(function ($, window, undefined) { // artDialog 只支持 xhtml 1.0 或者以上的 DOCTYPE 声明
if (document.compatMode === 'BackCompat') {
throw new Error('artDialog: Document types require more than xhtml1.0');
}; var _singleton,
_count = 0,
_expando = 'artDialog' + + new Date,
_isIE6 = window.VBArray && !window.XMLHttpRequest,
_isMobile = 'createTouch' in document && !('onmousemove' in document)
|| /(iPhone|iPad|iPod)/i.test(navigator.userAgent),
_isFixed = !_isIE6 && !_isMobile; var artDialog = function (config, ok, cancel) { config = config || {}; if (typeof config === 'string' || config.nodeType === 1) { config = {content: config, fixed: !_isMobile};
}; var api, defaults = artDialog.defaults;
var elem = config.follow = this.nodeType === 1 && this || config.follow; // 合并默认配置
for (var i in defaults) {
if (config[i] === undefined) {
config[i] = defaults[i];
};
}; config.id = elem && elem[_expando + 'follow'] || config.id || _expando + _count;
api = artDialog.list[config.id]; if (api) {
if (elem) {
api.follow(elem)
};
api.zIndex().focus();
return api;
}; // 目前主流移动设备对fixed支持不好
if (!_isFixed) {
config.fixed = false;
}; // !$.isArray(config.button)
if (!config.button || !config.button.push) {
config.button = [];
}; // 确定按钮
if (ok !== undefined) {
config.ok = ok;
}; if (config.ok) {
config.button.push({
id: 'ok',
value: config.okValue,
callback: config.ok,
focus: true
});
}; // 取消按钮
if (cancel !== undefined) {
config.cancel = cancel;
}; if (config.cancel) {
config.button.push({
id: 'cancel',
value: config.cancelValue,
callback: config.cancel
});
}; // 更新 zIndex 全局配置
artDialog.defaults.zIndex = config.zIndex; _count ++; return artDialog.list[config.id] = _singleton ?
_singleton.constructor(config) : new artDialog.fn.constructor(config);
}; artDialog.version = '5.0'; artDialog.fn = artDialog.prototype = { /** @inner */
constructor: function (config) {
var dom; this.closed = false;
this.config = config;
this.dom = dom = this.dom || this._getDom(); config.skin && dom.wrap.addClass(config.skin); dom.wrap.css('position', config.fixed ? 'fixed' : 'absolute');
dom.close[config.cancel === false ? 'hide' : 'show']();
dom.content.css('padding', config.padding); this.button.apply(this, config.button); this.title(config.title)
.content(config.content)
.size(config.width, config.height)
.time(config.time); config.follow
? this.follow(config.follow)
: this.position(); this.zIndex();
config.lock && this.lock(); this._addEvent();
this[config.visible ? 'visible' : 'hidden']().focus(); _singleton = null; config.initialize && config.initialize.call(this); return this;
}, /**
* 设置内容
* @param {String, HTMLElement, Object} 内容 (可选)
*/
content: function (message) { var prev, next, parent, display,
that = this,
$content = this.dom.content,
content = $content[0]; if (this._elemBack) {
this._elemBack();
delete this._elemBack;
}; if (typeof message === 'string') { $content.html(message);
} else if (message && message.nodeType === 1) { // 让传入的元素在对话框关闭后可以返回到原来的地方
display = message.style.display;
prev = message.previousSibling;
next = message.nextSibling;
parent = message.parentNode; this._elemBack = function () {
if (prev && prev.parentNode) {
prev.parentNode.insertBefore(message, prev.nextSibling);
} else if (next && next.parentNode) {
next.parentNode.insertBefore(message, next);
} else if (parent) {
parent.appendChild(message);
};
message.style.display = display;
that._elemBack = null;
}; $content.html('');
content.appendChild(message);
$(message).show(); }; return this.position();
}, /**
* 设置标题
* @param {String, Boolean} 标题内容. 为 false 则隐藏标题栏
*/
title: function (content) { var dom = this.dom,
outer = dom.outer,
$title = dom.title,
className = 'd-state-noTitle'; if (content === false) {
$title.hide().html('');
outer.addClass(className);
} else {
$title.show().html(content);
outer.removeClass(className);
}; return this;
},
/** @inner 位置居中 */
position: function () { var dom = this.dom,
wrap = dom.wrap[0],
$window = dom.window,
$document = dom.document,
fixed = this.config.fixed,
dl = fixed ? 0 : $document.scrollLeft(),
dt = fixed ? 0 : $document.scrollTop(),
ww = $window.width(),
wh = $window.height(),
ow = wrap.offsetWidth,
oh = wrap.offsetHeight,
left = (ww - ow) / 2 + dl,
top = top = (oh < 4 * wh / 7 ? wh * 0.382 - oh / 2 : (wh - oh) / 2) + dt,
style = wrap.style; style.left = Math.max(left, dl) + 'px';
style.top = Math.max(top, dt) + 'px'; return this;
}, /**
* 尺寸
* @param {Number, String} 宽度
* @param {Number, String} 高度
*/
size: function (width, height) { var style = this.dom.main[0].style; if (typeof width === 'number') {
width = width + 'px';
}; if (typeof height === 'number') {
height = height + 'px';
}; style.width = width;
style.height = height; return this;
}, /**
* 跟随元素
* @param {HTMLElement}
*/
follow: function (elem) { var $elem = $(elem),
config = this.config; // 隐藏元素不可用
if (!elem || !elem.offsetWidth && !elem.offsetHeight) { return this.position(this._left, this._top);
}; var fixed = config.fixed,
expando = _expando + 'follow',
dom = this.dom,
$window = dom.window,
$document = dom.document,
winWidth = $window.width(),
winHeight = $window.height(),
docLeft = $document.scrollLeft(),
docTop = $document.scrollTop(),
offset = $elem.offset(),
width = elem.offsetWidth,
height = elem.offsetHeight,
left = fixed ? offset.left - docLeft : offset.left,
top = fixed ? offset.top - docTop : offset.top,
wrap = this.dom.wrap[0],
style = wrap.style,
wrapWidth = wrap.offsetWidth,
wrapHeight = wrap.offsetHeight,
setLeft = left - (wrapWidth - width) / 2,
setTop = top + height,
dl = fixed ? 0 : docLeft,
dt = fixed ? 0 : docTop; setLeft = setLeft < dl ? left :
(setLeft + wrapWidth > winWidth) && (left - wrapWidth > dl)
? left - wrapWidth + width
: setLeft; setTop = (setTop + wrapHeight > winHeight + dt)
&& (top - wrapHeight > dt)
? top - wrapHeight
: setTop; style.left = setLeft + 'px';
style.top = setTop + 'px'; this._follow && this._follow.removeAttribute(expando);
this._follow = elem;
elem[expando] = config.id; return this;
}, /**
* 自定义按钮
* @example
button({
value: 'login',
callback: function () {},
disabled: false,
focus: true
}, .., ..)
*/
button: function () { var dom = this.dom,
$buttons = dom.buttons,
elem = $buttons[0],
strongButton = 'd-state-highlight',
listeners = this._listeners = this._listeners || {},
ags = [].slice.call(arguments); var i = 0, val, value, id, isNewButton, button; for (; i < ags.length; i ++) { val = ags[i]; value = val.value;
id = val.id || value;
isNewButton = !listeners[id];
button = !isNewButton ? listeners[id].elem : document.createElement('input'); button.type = 'button';
button.className = 'd-button'; if (!listeners[id]) {
listeners[id] = {};
}; if (value) {
button.value = value;
}; if (val.width) {
button.style.width = val.width;
}; if (val.callback) {
listeners[id].callback = val.callback;
}; if (val.focus) {
this._focus && this._focus.removeClass(strongButton);
this._focus = $(button).addClass(strongButton);
this.focus();
}; button[_expando + 'callback'] = id;
button.disabled = !!val.disabled;
if (isNewButton) {
listeners[id].elem = button;
elem.appendChild(button);
};
}; $buttons[0].style.display = ags.length ? '' : 'none'; return this;
}, /** 显示对话框 */
visible: function () {
//this.dom.wrap.show();
this.dom.wrap.css('visibility', 'visible');
this.dom.outer.addClass('d-state-visible'); if (this._isLock) {
this._lockMask.show();
}; return this;
}, /** 隐藏对话框 */
hidden: function () {
//this.dom.wrap.hide();
this.dom.wrap.css('visibility', 'hidden');
this.dom.outer.removeClass('d-state-visible'); if (this._isLock) {
this._lockMask.hide();
}; return this;
}, /** 关闭对话框 */
close: function () { if (this.closed) {
return this;
}; var dom = this.dom,
$wrap = dom.wrap,
list = artDialog.list,
beforeunload = this.config.beforeunload,
follow = this.config.follow; if (beforeunload && beforeunload.call(this) === false) {
return this;
}; if (artDialog.focus === this) {
artDialog.focus = null;
}; if (follow) {
follow.removeAttribute(_expando + 'follow');
}; if (this._elemBack) {
this._elemBack();
}; this.time();
this.unlock();
this._removeEvent();
delete list[this.config.id]; if (_singleton) { $wrap.remove(); // 使用单例模式
} else { _singleton = this; dom.title.html('');
dom.content.html('');
dom.buttons.html(''); $wrap[0].className = $wrap[0].style.cssText = '';
dom.outer[0].className = 'd-outer'; $wrap.css({
left: 0,
top: 0,
position: _isFixed ? 'fixed' : 'absolute'
}); for (var i in this) {
if (this.hasOwnProperty(i) && i !== 'dom') {
delete this[i];
};
}; this.hidden(); }; this.closed = true;
return this;
}, /**
* 定时关闭
* @param {Number} 单位毫秒, 无参数则停止计时器
*/
time: function (time) { var that = this,
timer = this._timer; timer && clearTimeout(timer); if (time) {
this._timer = setTimeout(function(){
that._click('cancel');
}, time);
}; return this;
}, /** @inner 设置焦点 */
focus: function () { if (this.config.focus) {
//setTimeout(function () {
try {
var elem = this._focus && this._focus[0] || this.dom.close[0];
elem && elem.focus();
// IE对不可见元素设置焦点会报错
} catch (e) {};
//}, 0);
}; return this;
}, /** 置顶对话框 */
zIndex: function () { var dom = this.dom,
top = artDialog.focus,
index = artDialog.defaults.zIndex ++; // 设置叠加高度
dom.wrap.css('zIndex', index);
this._lockMask && this._lockMask.css('zIndex', index - 1); // 设置最高层的样式
top && top.dom.outer.removeClass('d-state-focus');
artDialog.focus = this;
dom.outer.addClass('d-state-focus'); return this;
}, /** 设置屏锁 */
lock: function () { if (this._isLock) {
return this;
}; var that = this,
config = this.config,
dom = this.dom,
div = document.createElement('div'),
$div = $(div),
index = artDialog.defaults.zIndex - 1; this.zIndex();
dom.outer.addClass('d-state-lock'); $div.css({
zIndex: index,
position: 'fixed',
left: 0,
top: 0,
width: '100%',
height: '100%',
overflow: 'hidden'
}).addClass('d-mask'); if (!_isFixed) {
$div.css({
position: 'absolute',
width: $(window).width() + 'px',
height: $(document).height() + 'px'
});
}; $div.bind('click', function () {
that._reset();
}).bind('dblclick', function () {
that._click('cancel');
}); document.body.appendChild(div); this._lockMask = $div;
this._isLock = true; return this;
}, /** 解开屏锁 */
unlock: function () { if (!this._isLock) {
return this;
}; this._lockMask.unbind();
this._lockMask.hide();
this._lockMask.remove(); this.dom.outer.removeClass('d-state-lock');
this._isLock = false; return this;
}, // 获取元素
_getDom: function () { var body = document.body; if (!body) {
throw new Error('artDialog: "documents.body" not ready');
}; var wrap = document.createElement('div'); wrap.style.cssText = 'position:absolute;left:0;top:0';
wrap.innerHTML = artDialog._templates;
body.insertBefore(wrap, body.firstChild); var name,
i = 0,
dom = {},
els = wrap.getElementsByTagName('*'),
elsLen = els.length; for (; i < elsLen; i ++) {
name = els[i].className.split('d-')[1];
if (name) {
dom[name] = $(els[i]);
};
}; dom.window = $(window);
dom.document = $(document);
dom.wrap = $(wrap); return dom;
}, // 按钮回调函数触发
_click: function (id) { var fn = this._listeners[id] && this._listeners[id].callback; return typeof fn !== 'function' || fn.call(this) !== false ?
this.close() : this;
}, // 重置位置
_reset: function () {
var elem = this.config.follow;
elem ? this.follow(elem) : this.position();
}, // 事件代理
_addEvent: function () { var that = this,
dom = this.dom; // 监听点击
dom.wrap
.bind('click', function (event) { var target = event.target, callbackID; // IE BUG
if (target.disabled) {
return false;
}; if (target === dom.close[0]) {
that._click('cancel');
return false;
} else {
callbackID = target[_expando + 'callback'];
callbackID && that._click(callbackID);
}; })
.bind('mousedown', function () {
that.zIndex();
}); }, // 卸载事件代理
_removeEvent: function () {
this.dom.wrap.unbind();
} }; artDialog.fn.constructor.prototype = artDialog.fn; $.fn.dialog = $.fn.artDialog = function () {
var config = arguments;
this[this.live ? 'live' : 'bind']('click', function () {
artDialog.apply(this, config);
return false;
});
return this;
}; /** 最顶层的对话框API */
artDialog.focus = null; /**
* 根据 ID 获取某对话框 API
* @param {String} 对话框 ID
* @return {Object} 对话框 API (实例)
*/
artDialog.get = function (id) {
return id === undefined
? artDialog.list
: artDialog.list[id];
}; artDialog.list = {}; // 全局快捷键
$(document).bind('keydown', function (event) {
var target = event.target,
nodeName = target.nodeName,
rinput = /^input|textarea$/i,
api = artDialog.focus,
keyCode = event.keyCode; if (!api || !api.config.esc || rinput.test(nodeName) && target.type !== 'button') {
return;
}; // ESC
keyCode === 27 && api._click('cancel');
}); // 浏览器窗口改变后重置对话框位置
$(window).bind('resize', function () {
var dialogs = artDialog.list;
for (var id in dialogs) {
dialogs[id]._reset();
};
}); // XHTML 模板
// 使用 uglifyjs 压缩能够预先处理"+"号合并字符串
// @see http://marijnhaverbeke.nl/uglifyjs
artDialog._templates =
'<div class="d-outer">'
+ '<table class="d-border">'
+ '<tbody>'
+ '<tr>'
+ '<td class="d-nw"></td>'
+ '<td class="d-n"></td>'
+ '<td class="d-ne"></td>'
+ '</tr>'
+ '<tr>'
+ '<td class="d-w"></td>'
+ '<td class="d-c">'
+ '<div class="d-inner">'
+ '<table class="d-dialog">'
+ '<tbody>'
+ '<tr>'
+ '<td class="d-header">'
+ '<div class="d-titleBar">'
+ '<div class="d-title"></div>'
+ '<a class="d-close" href="javascript:/*artDialog*/;">'
+ '\xd7'
+ '</a>'
+ '</div>'
+ '</td>'
+ '</tr>'
+ '<tr>'
+ '<td class="d-main">'
+ '<div class="d-content"></div>'
+ '</td>'
+ '</tr>'
+ '<tr>'
+ '<td class="d-footer">'
+ '<div class="d-buttons"></div>'
+ '</td>'
+ '</tr>'
+ '</tbody>'
+ '</table>'
+ '</div>'
+ '</td>'
+ '<td class="d-e"></td>'
+ '</tr>'
+ '<tr>'
+ '<td class="d-sw"></td>'
+ '<td class="d-s"></td>'
+ '<td class="d-se"></td>'
+ '</tr>'
+ '</tbody>'
+ '</table>'
+'</div>'; /**
* 默认配置
*/
artDialog.defaults = { // 消息内容
content: '<div class="d-loading"><span>loading..</span></div>', // 标题
title: 'message', // 自定义按钮
button: null, // 确定按钮回调函数
ok: null, // 取消按钮回调函数
cancel: null, // 对话框初始化后执行的函数
initialize: null, // 对话框关闭前执行的函数
beforeunload: null, // 确定按钮文本
okValue: 'ok', // 取消按钮文本
cancelValue: 'cancel', // 内容宽度
width: 'auto', // 内容高度
height: 'auto', // 内容与边界填充距离
padding: '20px 25px', // 皮肤名(多皮肤共存预留接口)
skin: null, // 自动关闭时间
time: null, // 是否支持Esc键关闭
esc: true, // 是否支持对话框按钮自动聚焦
focus: true, // 初始化后是否显示对话框
visible: true, // 让对话框跟随某元素
follow: null, // 是否锁屏
lock: false, // 是否固定定位
fixed: false, // 对话框叠加高度值(重要:此值不能超过浏览器最大限制)
zIndex: 1987 }; this.artDialog = $.dialog = $.artDialog = artDialog;
}(this.art || this.jQuery, this));
封装方法到对象(javascript)的更多相关文章
- 使用DOM的方法获取所有li元素,然后使用jQuery()构造函数把它封装为jQuery对象
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Javascript 封装方法
基本封装方法 请看下面的例子: var Person = function(name,age){ this.name = name; this.age = age || "未填写" ...
- JavaScript Number 对象 Javascript Array对象 Location 对象方法 String对象方法
JavaScript Number 对象 Number 对象属性 属性 描述 constructor 返回对创建此对象的 Number 函数的引用. MAX_VALUE 可表示的最大的数. MIN_V ...
- 分享几个Javascript 封装方法
基本封装方法 请看下面的例子: var Person = function(name,age){ this.name = name; this.age = age || "未填写" ...
- JSON.stringify()方法是将一个javascript值(对象或者数组)转换成为一个JSON字符串;JSON.parse()解析JSON字符串,构造由字符串描述的javascript值或对象
JSON.stringify()方法是将一个javascript值(对象或者数组)转换成为一个JSON字符串:JSON.parse()解析JSON字符串,构造由字符串描述的javascript值或对象
- 面向对象银角大王补充2-self就是调用当前方法的对象-静态字段,公有属性-封装的理解-继承的理解,普通方法,静态方法
self是什么,就是一个函数,就是一个形式参数 4.self就是调用当前方法的对象 静态字段,公有属性 静态字段使用场景,每个对象中保存相同的东西时,可以使用静态字段,公有属性 5.封装的理解 类中封 ...
- JS对象 JavaScript 中的所有事物都是对象,如:字符串、数值、数组、函数等,每个对象带有属性和方法。
什么是对象 JavaScript 中的所有事物都是对象,如:字符串.数值.数组.函数等,每个对象带有属性和方法. 对象的属性:反映该对象某些特定的性质的,如:字符串的长度.图像的长宽等: 对象的方法: ...
- DBUtils封装数据库返回对象的各种方法
①ArrayHandler: 将查询结果的第一行数据,保存到Object数组中 ②ArrayListHandler 将查询的结果,每一行先封装到Object数组中,然后将数 ...
- JavaScript RegExp ——对象,语法,修饰符,方括号,元字符,量词,对象方法,对象属性
㈠RegExp 对象 正则表达式是描述字符模式的对象. 正则表达式用于对字符串模式匹配及检索替换,是对字符串执行模式匹配的强大工具. ㈡语法 var patt=new RegExp(pattern,m ...
随机推荐
- ElasticSearch mapping中字段属性总结
- jquery通过submit()和serialize()提交表单
<script type="text/javascript"> $(function() { $('#form1').submit(function() { //当提交 ...
- SVM 之 MATLAB 实现代码
MATLAB 中 SVM 实现 直接上代码 main.m %% Initialize data clear, clc, close all; load('data.mat'); y(y == 0) = ...
- nyoj 1192——Salvation——————【搜索】
Salvation 时间限制:1000 ms | 内存限制:65535 KB 难度:3 描述 神秘瀑布镇是一个神秘的地方,那里有吸血鬼,狼人,巫师,二重身. Klaus(吸血鬼祖先) 为了利用 ...
- JavaScript 闭包初认识
1.简单的例子 首先从一个经典错误谈起,页面上有若干个div, 我们想给它们绑定一个onclick方法,于是有了下面的代码 <ul id="divTest"> < ...
- 浅谈C#中HttpWebRequest与HttpWebResponse的使用方法
1.第一招,根据URL地址获取网页信息get方法 public static string GetUrltoHtml(string Url,string type) { try { System.Ne ...
- c# 使用队列保存图片
Invoke(new EventHandler(delegate { Bitmap bitmap2 = (Bitmap)eventArgs.Frame.Clone(); ThreadPool.Queu ...
- js之正则表达式基础
字符串是编程时涉及到的最多的一种数据结构,对字符串进行操作的需求几乎无处不在.比如判断一个字符串是否是合法的Email地址,虽然可以编程提取@前后的子串,再分别判断是否是单词和域名,但这样做不但麻烦, ...
- sublime开启vi编辑器功能,与vi常用快捷键
sublime开启vi编辑器 install package -> vintageES 设置里面 ignored_packages 里面的vintage去掉 VI命令 游标控制 h 游标向左移 ...
- java中的集合和视图
一.集合的概念 何为集合,集合就是相当于一个对象的容器.集合是类似数组的一个作用.既然有了数组,为何还要有集合呢,由于数组对象一旦创建,其大小便不可以更改,我们只能往数组中存放创建时数量的对象.而集合 ...