最近写的一个基于INPUT的简单封装,欢迎指教
更改样式,样式在代码中,请自行修改
扩展,UI.Button是基础,部份属性已列出
封装了表单中的:
密码框和图片按纽;文件框和按钮;日期选择框;下拉选择框;
下拉选择框的简单运用;多级连动选择框-json(通过Selects索引获取下拉选择框的属性)
多级连动选择框-xml(通过Selects索引获取下拉选择框的属性)
效果在线演示:http://www.aspxhome.com/.../input.htm
los.js代码:
var Los = {};
Los.Path = "./images/";
Los.Create_Count = 0;
Los.Browser = (function () {
var nu = navigator.userAgent;
if (nu.search(/gecko/i) > -1)
return("ff");
else if (nu.search(/msie 7.0/i) > -1)
return("ie7");
else if (nu.search(/msie 6.0/i) > -1)
return("ie6");
else {
//window.location.replace("otherbrower.htm");
return("other");
}
})().toString();
if (document.implementation.hasFeature("XPath", "3.0")) {
XMLDocument.prototype.selectNodes = function(cXPathString, xNode) {
if( !xNode ) { xNode = this; }
var oNSResolver = this.createNSResolver(this.documentElement)
var aItems = this.evaluate(cXPathString, xNode, oNSResolver, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null)
var aResult = [];
for( var i = 0; i < aItems.snapshotLength; i++) aResult[i] = aItems.snapshotItem(i);
return aResult;
}
Element.prototype.selectNodes = function(cXPathString) {
if(this.ownerDocument.selectNodes)
return this.ownerDocument.selectNodes(cXPathString, this);
else
throw "For XML Elements Only";
}
}
Los.Get = function() {
var _o = arguments.length ? arguments[0] : new Object;
if (typeof(arguments[0]) == "string") _o = {Type : "id", Text : arguments[0]};
switch (_o.Type) {
case "id" : _o.obj = document.getElementById(_o.Text);
_o.obj = _o.obj ? _o.obj : null;
break;
case "name" : _o.obj = document.getElementsByTagName(_o.Text.toUpperCase());
_o.obj = _o.obj.length == 0 ? null : (_o.Index > -1 ? (_o.obj[_o.Index] ? _o.obj[_o.Index] : null) : _o.obj);
break;
case "form" : _o.obj = document.forms(_o.Text);
_o.obj = _o.obj ? _o.obj : null;
break;
case "window" : _o.obj = document.getElementById(_o.Text);
_o.obj = _o.obj ? _o.obj.contentWindow : null;
break;
default : return(_o);
}
return _o.obj;
}
Los.XML = function() {
this.LoadXML = function(str) {
var xml;
if (Los.Browser != "ff") {
xml = new ActiveXObject("Microsoft.XMLDOM");
xml.async = false;
xml.loadXML(str);
}
else {
var oParser=new DOMParser();
xml = document.implementation.createDocument("", "", null);
xml = oParser.parseFromString(str, "text/xml");
}
return(xml);
}
this.Load = function(file) {
}
}
Los.UI = new function() {
this.Arguments = function(arg) {
var _o = arg.length ? arg[0] : new Object;
if (typeof(arg[0]) == "string") _o = {Id : arg[0]};
return _o;
}
}
Los.UI.Expansion_Public = function() {
this._Edit = true, this._Disabled = false;
this.Check = function (o) {
for (var i in o) { try { this[i](o[i]) } catch(e) {}}
}
this.AddTo = function (o) {
o = Los.Get(o);
if (!o) {alert(o);return;}
o.appendChild(this);
}
this.getName = function (Text) {
return this.getElementsByTagName(Text.toUpperCase());
}
this.Text = function (Text) { this.setValue(Text) }
this.addEvent = function (evt, fun) { Los.Browser != "ff" ? this.attachEvent("on" + evt, fun) : this.addEventListener(evt, fun, false) }
this.removeEvent = function (evt, fun) { Los.Browser != "ff" ? this.detachEvent("on" + evt, fun) : this.removeEventListener(evt, fun, false) }
}
全部代码打包下载:los-input-style.rar(24KB)