超酷的js效果,js增删除行,编辑,等

作者：袖梨 2022-07-02

提示：您可以先修改部分代码再运行

<html>
<head>
<title>xGrid Version 3.0 Demo Page</title>

function xGrid(c){
/*
待开发列表:?.每行数据列数据有效性验证    ??年3月22日 已完成 this.validrow?.获得需要提交的数据form格式  ??年3月22日 已完成 this.getformdata….获得需要提交的数据ajax格式  ??年3月22日 已完成 this.getajaxdata?.获提数据JSON格式             2008年3月22日 已完成 this.getjsondata?.获得数据XML格式             ??年3月22日 已完成 this.getxmldata?.快捷键                      ??年3月27日 已完成 ctrl+ins=新增行,ctrl+del=删除当前光标所在行

//全局定义
this.$=function (){var elements=new Array();for(var i=0;i<arguments.length;i++){var element=arguments[i];if(typeof element=='string')element=document.getElementById(element);if(arguments.length==1)return element;elements.push(element);};return elements;};
this.$c=function (id){return document.createElement(id)};
this.$insRow=function (c){return c.obj.insertRow(c.idx);};
this.$addChild=function (c){c.obj.appendChild(c.node);};
this.toFloat = function (n, d){var re;if (isNaN(n) || n == ""){re = "";}else{re = Math.round(Math.pow(10, d) * n) / Math.pow(10, d);}return re;}
this.getURLpar = function(s,f){if(typeof(s)!='string'){return "";}var u = s.split("?");if(u.length<2){return "";}var p = u[1].split("&");var re="";for(var i=0;i<p.length;i++){var m = p[i].split("=");if(m[0].toLowerCase() == f.toLowerCase()){re = unescape(m[1]); break;}}return re;};
this.setURLpar = function (s,f,v){if(typeof (s)!='string'){return "";};var u=s.split("?");var url;if(u.length==2){url=u[0];var p=u[1].split("&");var re=false;var pt=[];for(var i=0;i<p.length;i++){var m=p[i].split("=");if(m[0].toLowerCase()==f.toLowerCase()){pt.push(m[0]+"="+v);re=true;}else {pt.push(m[0]+"="+m[1]);}};if(!re){pt.push(f+"="+v);};for(var i=0;i<pt.length;i++){if(i==0){url+="?"+pt[i];}else {url+="&"+pt[i];}}}else {url=s+"?"+f+"="+v;};return url;};
this.waitrun = function(call,time){setTimeout(call,time);}
this.Ajax=function ()
{
var me = this;
this.req=null;
this.par = null;
this.onload=onload;
this.onerror=(onerror)?onerror:this.defaultError;
this.url;
this.method;
this.params;
this.contentType;
this.loadXMLDoc=function (url,method,params,contentType){if(!method){method="GET";};if(!contentType&&method=="POST"){contentType="application/x-www-form-urlencoded";};if(window.XMLHttpRequest){this.req=new XMLHttpRequest();}else if(window.ActiveXObject){this.req=new ActiveXObject("Microsoft.XMLHTTP");};if(this.req){try{var loader=this;this.req.onreadystatechange=function (){me.onReadyState.call(loader);};this.req.open(method,url,true);if(contentType){this.req.setRequestHeader('Content-Type',contentType);};this.req.send(params);}catch(err){me.onerror.call(this);}}};
this.onReadyState=function (){var req=this.req;var ready=req.readyState;var httpStatus;try{httpStatus=req.status;}catch(err){};if(ready==4){if(httpStatus==200||httpStatus==0){this.onload.call(this);}else {this.onerror.call(this);}}};
this.defaultError=function (){alert("error fetching data!"+"nnreadyState:"+this.req.readyState+"nstatus: "+this.req.status+"nheaders: "+this.req.getAllResponseHeaders());};
this.POST=function (config){this.par=config.par;this.onload=config.CALL;this.onerror=config.ERRCALL;me.url=config.URL;me.method="POST";me.params=config.POST;me.load();};
this.GET=function (config){me.par = config.par;me.onload=config.CALL;me.onerror=config.ERRCALL;me.url = config.URL;me.load();};
this.load=function (){this.loadXMLDoc(me.url,me.method,me.params,me.contentType);};
}
this.ProcessBar = function(){
this.object = null;
this.allNode = null;
this.frmNode = null;
this.barNode = null;
this.txtNode = null;
this.useNode = null;
this.src = null;
this.txtTitle = "";
this.$ = function(){var elements = new Array();for (var i = 0; i < arguments.length; i++){ var element = arguments[i];if (typeof element == 'string'){element = document.getElementById(element);}if (arguments.length == 1){return element;elements.push(element);}}return elements;};
this.$C =function(id){return document.createElement(id);};
this.$Add=function(obj,onode){obj.appendChild(onode);};
this.delHTML = function(obj){if(!obj){return;}obj.innerHTML = "";};
this.Create=function (src){if(!src){return ;};this.src=src;var allNode=this.$C("div");allNode.id=this.src.id+"_ProcessBar_all";var frmNode=this.$C("div");frmNode.id=this.src.id+"_ProcessBar_frm";frmNode.style.border="1px";frmNode.style.borderStyle="solid";frmNode.style.borderColor="#8DBC8F";frmNode.style.;frmNode.style.padding="1px";frmNode.style.backgroundColor="#FFFFFF";frmNode.style.whiteSpace="nowrap";frmNode.style.overflow="hidden";var barNode=this.$C("div");barNode.id=this.src.id+"_ProcessBar_bar";barNode.style.;barNode.style.;barNode.style.backgroundColor="#0033FF";barNode.style.whiteSpace="nowrap";barNode.style.overflow="hidden";var txtNodes=this.$C("div");txtNodes.id=src.id+"_ProcessBar_txtNodes";var txtNode=this.$C("span");txtNode.id=src.id+"_ProcessBar_txt";txtNode.style.fontSize="9pt";var useNode=this.$C("span");useNode.id=src.id+"_ProcessBar_usetext";this.allNode=allNode;this.frmNode=frmNode;this.barNode=barNode;this.txtNode=txtNode;this.useNode=useNode;this.$Add(txtNodes,txtNode);this.$Add(txtNodes,useNode);this.$Add(frmNode,barNode);this.$Add(allNode,frmNode);this.$Add(allNode,txtNodes);this.object=allNode;};
this.setStyle = function(A){if(!A.src){return ;}var obj=A.src;obj.style.width=A.width;obj.style.height=A.height;obj.style.backgroundColor=A.bgcolor;}
this.applyTo = function(){if(!this.src){return;}if(!this.allNode){return;}this.delHTML(this.src);this.txtNode.innerHTML="0%...";this.$Add(this.src,this.allNode);}
this.run=function (max,n){if(!this.frmNode){return ;};if(!this.barNode){return ;};if(!this.txtNode){return ;};var maxLength;maxLength=parseFloat(this.frmNode.style.width)-4;var setp=parseFloat(maxLength/max);var nTotal=parseFloat(setp*n);var nPos=parseFloat(nTotal/maxLength*100);nPos=parseInt(nPos);this.barNode.style.%";this.txtNode.innerHTML=this.txtTitle+nPos+"%...";};
this.del = function(){this.src.innerHTML = "";}
this.setInfo = function(info){if(!this.useNode){return;}this.useNode.innerHTML = info;}
}
this.loadXmlRecord=function (){this.dataNode=[];this.nameNode=[];this.idxNode=[];this.load=function (doc,name,idxname){if(!doc){return ;};if(typeof (name)!="string"){return ;};var node=doc.getElementsByTagName(name);var tmp=[];for(var i=0;i<node.length;i++){tmp.push(node[i]);};this.dataNode.push(tmp);this.nameNode.push(name);this.idxNode.push(idxname);};this.getNodeIndex=function (nodeName){if(typeof (nodeName)!="string"){return ;};var re=-1;for(var i=0;i<this.idxNode.length;i++){if(nodeName==this.idxNode[i]){re=i;break;}};return re;};this.getNode=function (idx){if(idx<0){return ;};var re=this.dataNode[idx];if(typeof (re)!="object"){return [];}else {return re;}};this.getNodeValue=function (obj,name){if(!obj){return ;};if(typeof (name)!="string"){return ;};try{var nodeValue=obj.getElementsByTagName(name)[0].text;return unescape(nodeValue);}catch(e){return "";}};this.getButeValue=function (obj,name){if(!obj){return ;};if(typeof (name)!="string"){return ;};try{var nodeValue=obj.getAttribute(name);return unescape(nodeValue);}catch(e){return "";}};this.getSubNode=function (obj){try{var root=obj.childNodes;return root;}catch(e){return null;}};this.getParNode=function (obj){}};
this.nodeAttribute = function(node){
this.node=node;this.tagName="";this.allcolums=[];this.colums=[];
if(this.node){this.tagName=this.node.tagName;for(var i=0;i<this.node.attributes.length;i++){if(this.node.attributes[i].specified){this.colums.push({name:this.node.attributes[i].nodeName,value:this.node.attributes[i].nodeValue});}else {this.allcolums.push({name:this.node.attributes[i].nodeName,value:this.node.attributes[i].nodeValue});}}};
this.checkName=function (name){var re=false;for(var i=0;i<this.colums.length;i++){if(name.toLowerCase()==this.colums[i].name.toLowerCase()){re=true;break;}};return re;};
this.setValue=function (name,value){try{var re=false;var tmp=[];for(var i=0;i<this.colums.length;i++){if(this.colums[i].name.toLowerCase()==name.toLowerCase()){tmp.push({name:name,value:value});re=true;}else {tmp.push({name:this.colums[i].name,value:this.colums[i].value});}};if(!re){tmp.push({name:name,value:value});re=true;};this.colums=tmp;return re;}catch(e){return false;}};
this.delName=function (name){try{var re=false;var tmp=[];for(var i=0;i<this.colums.length;i++){if(this.colums[i].name.toLowerCase()==name.toLowerCase()){this.node.removeAttribute(this.colums[i].name.toString ());re=true;}else {tmp.push({name:this.colums[i].name,value:this.colums[i].value});}};this.colums=tmp;return re;}catch(e){return false;}};
this.getValue=function (name){var re=null;for(var i=0;i<this.colums.length;i++){if(this.colums[i].name.toLowerCase()==name.toLowerCase()){re=this.colums[i].value;break;}};return re;};
this.appValue=function (name){try{var re=false;for(var i=0;i<this.colums.length;i++){if(this.colums[i].name.toLowerCase()==name.toLowerCase()){this.node.setAttribute(this.colums[i].name.toString (),this.colums[i].value.toString ());re=true;break;}};return re;}catch(e){return false;}};
this.appAllValue=function (){try{for(var i=0;i<this.colums.length;i++){this.node.setAttribute(this.colums[i].name.toString (),this.colums[i].value.toString ());};return true;}catch(e){return false;}};
this.getAjax=function (){var outstr="";for(var i=0;i<this.colums.length;i++){outstr+="&"+this.colums[i].name.toString ()+"="+escape(this.colums[i].value.toString ());};return outstr;};
this.getPost=function (){var outstr="";for(var i=0;i<this.colums.length;i++){outstr+="<input type=hidden name="+this.colums[i].name.toString ()+" value="+escape(this.colums[i].value.toString ())+" >rn";};return outstr;};
this.listAll=function (){var outstr="";for(var i=0;i<this.colums.length;i++){outstr+=this.colums[i].name.toString ()+"="+this.colums[i].value.toString ()+"rn";};alert(outstr);};
}

this.Ex = function(){
this.chk=function (c){var re=false;var obj=c.obj;for(var name in c.obj){if(name.toString ()==c.name.toString ()){re=true;break;}};return re;};
this.add=function (c){var re=false;if(this.chk({obj:c.obj,name:c.name})){this.update({obj:c.obj,name:c.name,value:c.value});re=true;}else {if(typeof (c.obj)=='string'){re=false;}else {re=true;c.obj[c.name]=c.value;}};return re;};
this.update=function (c){var re=false;try{if(this.chk({obj:c.obj,name:c.name})){re=true;c.obj[c.name]=c.value;}else {re=false;}}catch(e){re=false;};return false;};
this.del=function (c){var re=false;try{if(this.chk({obj:c.obj,name:c.name})){re=true;delete c.obj[c.name.toString ()];}else {re=false;}}catch(e){re=false;};return re;};
this.getall=function (c){var obj=c.obj;var re=[];for(var name in c.obj){var tmp={};tmp.name=name.toString ();tmp.value=c.obj[name.toString ()];tmp.type=typeof (c.obj[name.toString ()]);re.push(tmp);};return re;};
this.getallname=function (c){var obj=c.obj;var re=[];for(var name in c.obj){re.push(name.toString ());};return re;};
this.getallvalue=function (c){var obj=c.obj;var re=[];for(var name in c.obj){re.push(obj[name.toString ()]);};return re;};
this.getprotype=function (c){var obj=c.obj;var re=[];for(var name in c.obj){if(typeof (obj[name])=='string'){re.push(name.toString ());}};return re;};
this.getprofun=function (c){var obj=c.obj;var re=[];for(var name in c.obj){if(typeof (obj[name])=='function'||typeof (obj[name])=='object'){re.push(name.toString ());}};return re;};
}

//初始化参数定义
var me = this;
this.ex = new this.Ex();
this.name    = c.name;
this.defRows = 0;
this.handDom = c.src;
this.ifnav   = c.ifnav;//是否有导航页
this.ifselectrow = c.ifselectrow;
this.moveleft = c.moveleft;
this.moveright = c.moveright;
this.ifresize  = c.ifresize;//允许调整标题宽度
this.ifapplyto = c.ifapplyto;
this.handFlag = false;
if(c.rows==''||c.rows==null||typeof (c.rows)=='undefined'||isNaN(parseInt(c.rows))){this.defRows=0;}else {this.defRows=parseInt(c.rows);};
if(c.src==''||c.src==null||typeof (c.src)=='undefined'){this.handDom=null;}else {this.handDom=this.$(c.src);};
if(this.handDom){this.handFlag=true;};
if(c.name==''||typeof (c.name)=='undefined'||c.name==null){this.name='noname';}else {if(typeof (c.name)=='string'){this.name=c.name}else {this.name='noname';}};
if(c.ifnav==''||typeof(c.ifnav)=='undefined'||c.ifnav == null){this.ifnav = false;}else{ if (typeof(c.ifnav) == 'boolean') {  this.ifnav = c.ifnav; }else{  this.ifnav = false; }}
if(c.ifselectrow==''||typeof(c.ifselectrow)=='undefined'||c.ifselectrow == null){this.ifselectrow = false;}else{ if (typeof(c.ifselectrow) == 'boolean') {  this.ifselectrow = c.ifselectrow; }else{  this.ifselectrow = false; }}
if(c.moveleft==''||c.moveleft==null||typeof(c.moveleft)=='undefined'){this.moveleft=function (){};}else {if(typeof(c.moveleft)=='function'){this.moveleft=c.moveleft;}else {this.moveleft=function (){};}};
if(c.moveright==''||c.moveright==null||typeof(c.moveright)=='undefined'){this.moveright=function (){};}else {if(typeof(c.moveright)=='function'){this.moveright=c.moveright;}else {this.moveright=function (){};}};
if(c.ifresize==''||typeof(c.ifresize)=='undefined'||c.ifresize == null){this.ifresize = false;}else{ if (typeof(c.ifresize) == 'boolean') {  this.ifresize = c.ifresize; }else{  this.ifresize = false; }}
if(c.ifapplyto==''||typeof(c.ifapplyto)=='undefined'||c.ifapplyto == null){this.ifapplyto = false;}else{ if (typeof(c.ifapplyto) == 'boolean') {  this.ifapplyto = c.ifapplyto; }else{  this.ifapplyto = false; }}

//定义行和列对象
this.rowobject = [];
this.columsobject = [];
this.service = {};
this.service.ajax = new this.Ajax();
this.service.rsnode = this.nodeAttribute;
this.config = {};
this.config.Lines = this.defRows;
this.config.Dom   = this.handDom;
this.config.ifnav = this.ifnav;
this.config.ifapply = false;
this.config.processbar = new me.ProcessBar();
this.config.processdiv = null;
this.config.ifselectrow = this.ifselectrow;
this.config.ifresize    = this.ifresize;
this.config.offset = {};
this.config.offset.x = 0;
this.config.offset.y = 0;
this.config.offset.w = 0;
this.config.offset.i = 0;
this.config.offset.node = null;
this.config.offset.div = null;
this.config.moveleft = this.moveleft;
this.config.moveright = this.moveright;
this.config.table = null;
this.config.table;
this.config.lines = -1;
this.config.tabletitle = null;
this.config.tablesum   = null;
this.config.tablenav   = null;
this.config.templeterow = null;
this.config.tablenav    = null;
this.config.tablehead = {};
this.config.style = {};
this.config.style.boxblurcolor = "#FFFFFF";
this.config.style.boxfocuscolor= "#66FFCC";
this.config.style.rowblurcolor = "#FFFFFF";
this.config.style.rowfocuscolor = "#FCE4A7";
this.config.style.tablebgcolor = "#888888";
this.config.style.headbgcolor = "#DBDBDB";
this.config.style.sumbgcolor  = "#DBDBDB";
this.config.style.navbgcolor  = "#D8D8D8";
this.config.style.delIcon     = "ㄨ";
this.config.style.delIconAct  = "<font color=red><b>ㄨ</b></font>";
this.config.tablehead.<a href="http://www.111com.net/cssdiv/css.html" target="_blank">css</a>text = "color:#000000;font-size:9pt;font-family:宋体;";
this.config.curRow = {};
this.config.curCol = {};
this.config.curPos = {};
this.config.data = {};
this.config.data.rowdata = [];
this.config.data.tmpdata = [];
this.config.data.rowobj = [];
this.config.cache = {};
this.config.sort = {};
this.config.sort.charPYStr = "";
this.config.sort.charBHStr = "";
this.config.sort.charMode = true;
this.config.sort.colums   = null;
//是否FF浏览器
this.isIE = /msie/i.test(navigator.userAgent);
this.isFF = /firefox/i.test(navigator.userAgent);

//配置一个列的属性
//数据内容:
//title:标题名
//name:列名ID
//width:宽度
//datatype:数据类型,text,number
//ifhide:是否显示,true,false
//uitype:表现方式，textbox,select,dateselect,span
//ifsum:是否合计,true,flase
//floats:保留小数位数,0-4;
//tips:提示字串
//ifvalid:是否验证必填,true,false;
//validreg:用于验证的正则表达式,以function方式传入
//onkeydown:压键处理,caller
//onkeyup:压键离开处理,caller
//onfocus:聚焦处理,caller
//onblur:离开焦点处理,caller
//onenter:回车键处理,caller
//onclick:单击处理,caller
//ondblclick:双击处理,caller
//ifread:是否只读,true,false;
this.addcolums = function(c){
var tmp = {};
if(c.title=='' || typeof (c.title)=='undefined' || c.title == null){tmp.title='';}else {tmp.title=c.title;};
if(c.name == '' || typeof(c.name) == 'undefined' || c.name == null){tmp.name = 'noname'+this.columsbject.length;}else{tmp.name = c.name;};
if(c.'||typeof (c.width)=='undefined'||isNaN(parseInt(c.width))){tmp.;}else {tmp.width=parseInt(c.width);};
if(c.datatype==''||typeof (c.datatype)=='undefined'||c.datatype==null){tmp.datatype='text';}else {if(typeof (c.datatype)=='string'){tmp.datatype=c.datatype.toLowerCase();}else {tmp.datatype='text';}};
tmp.dataflag = this.switchcolumstype(tmp.datatype);
if(c.ifhide==''||typeof (c.ifhide)=='undefined'||c.ifhide==null){tmp.ifhide=false;}else {if(typeof (c.ifhide)=='boolean'){tmp.ifhide=c.ifhide;}else {tmp.ifhide=false;}};
if(c.uitype==''||typeof (c.uitype)=='undefined'||c.uitype==null){tmp.uitype='viewtext';}else {if(typeof (c.uitype)=='string'){tmp.uitype=c.uitype.toLowerCase();}else {tmp.uitype='viewtext';}};
if(c.ifsum==''||c.ifsum==null||typeof (c.ifsum)=='undefined'){tmp.ifsum=false;}else {if(typeof (c.ifsum)=='boolean'){tmp.ifsum=c.ifsum;}else {tmp.ifsum=false;}};
if(c.floats==''||c.floats==null||typeof (c.floats)=='undefined'||isNaN(parseInt(c.floats))){tmp.floats=0;}else {tmp.floats=parseInt(c.floats);};
if(c.tips==''||c.tips==null||typeof (c.tips)=='undefined'){tmp.tips='';}else {if(typeof (c.tips)=='string'){tmp.tips=c.tips;}else {tmp.tips='';}};
if(c.ifvalid==''||c.ifvalid==null||typeof (c.ifvalid)=='undefined'){tmp.ifvalid=false;}else {if(typeof (c.ifvalid)=='boolean'){tmp.ifvalid=c.ifvalid;}else {tmp.ifvalid=false;}};
if(c.validcall==''||c.validcall==null||typeof (c.validcall)=='undefined'){tmp.validcall=null;}else {if(typeof(c.validcall)=='function'){tmp.validcall=c.validcall;}else{tmp.validcall=null;}};
if(c.onkeydown==''||c.onkeydown==null||typeof (c.onkeydown)=='undefined'){tmp.onkeydown=function (){};}else {if(typeof (c.onkeydown)=='function'){tmp.onkeydown=c.onkeydown;}else {tmp.onkeydown=function (){};}};
if(c.onfocus==''||c.onfocus==null||typeof (c.onfocus)=='undefined'){tmp.onfocus=function (){};}else {if(typeof (c.onfocus)=='function'){tmp.onfocus=c.onfocus;}else {tmp.onfocus=function (){};}};
if(c.onblur==''||c.onblur==null||typeof (c.onblur)=='undefined'){tmp.onblur=function (){};}else {if(typeof (c.onblur)=='function'){tmp.onblur=c.onblur;}else {tmp.onblur=function (){};}};
if(c.onchange==''||c.onchange==null||typeof (c.onchange)=='undefined'){tmp.onchange=function (){};}else {if(typeof (c.onchange)=='function'){tmp.onchange=c.onchange;}else {tmp.onchange=function (){};}};
if(c.onclick==''||c.onclick==null||typeof (c.onclick)=='undefined'){tmp.onclick=function (){};}else {if(typeof (c.onclick)=='function'){tmp.onclick=c.onclick;}else {tmp.onclick=function (){};}};
if(c.ondblclick==''||c.ondblclick==null||typeof (c.ondblclick)=='undefined'){tmp.ondblclick=function (){};}else {if(typeof (c.ondblclick)=='function'){tmp.ondblclick=c.ondblclick;}else {tmp.ondblclick=function (){};}};
if(c.onenter==''||c.onenter==null||typeof (c.onenter)=='undefined'){tmp.onenter=function (){};}else {if(typeof (c.onenter)=='function'){tmp.onenter=c.onenter;}else {tmp.onenter=function (){};}};
if(c.onkeyup==''||c.onkeyup==null||typeof (c.onkeyup)=='undefined'){tmp.onkeyup=function (){};}else {if(typeof (c.onkeyup)=='function'){tmp.onkeyup=c.onkeyup;}else {tmp.onkeyup=function (){};}};
if(c.realcall==''||c.realcall==null||typeof(c.realcall)=='undefined'){tmp.realcall=function (){};}else {if(typeof(c.realcall)=='function'){tmp.realcall=c.realcall;}else {tmp.realcall=function (){};}};
if(c.align==''||c.align==null||typeof (c.align)=='undefined'){tmp.align="left";}else {if(typeof (c.align)=='string'){tmp.align=c.align;}else {tmp.align="left";}};
if(c.errmsg==''||c.errmsg==null||typeof (c.errmsg)=='undefined'){tmp.errmsg="";}else {if(typeof (c.errmsg)=='string'){tmp.errmsg=c.errmsg;}else {tmp.errmsg="";}};
if(c.ifsort==''||typeof (c.ifsort)=='undefined'||c.ifsort==null){tmp.ifsort=false;}else {if(typeof (c.ifsort)=='boolean'){tmp.ifsort=c.ifsort;}else {tmp.ifsort=false;}};
if(c.sorttype==''||typeof (c.sorttype)=='undefined'||c.sorttype==null){tmp.sorttype='asc';}else {if(typeof (c.sorttype)=='string'){tmp.sorttype=c.sorttype.toLowerCase();}else {tmp.sorttype='asc';}};

tmp.colnum = this.columsobject.length;
this.columsobject.push(tmp);
}

//this table applyto grid
this.applyto = function(){
if (!this.config.Dom){this.config.Dom = document.body;}
if (!this.config.table){this.config.table = this.$(this.name);}
if (!this.config.table){return;}
if (this.config.table.ifxgrid){return;}
this.config.table.ifxgrid = true;
if (!this.config.ifapply)
{
var row = this.config.table.rows[0];
if (row)
{
  
  this.applyreadrowconfig(row);
  this.config.tabletitle = row;
  this.applyinit();
  this.config.ifapply = true;
  
}
}

}

//this table init to Grid
this.applyinit = function(){

this.config.table.id = this.name;
this.config.table.name = this.name;
this.config.table.style.cssText = this.config.tablehead.csstext;
this.config.table.bgColor = this.config.style.tablebgcolor;
this.config.table.style.width = this.config.tablewidth;
this.config.table.cellPadding = 0;
this.config.table.cellSpacing = 1;
this.config.table.onkeydown = me.tableonkeydown;
this.config.table.onkeyup   = me.tableonkeyup;
this.config.table.Lines = this.config.Lines;
this.config.table.ifselectrow = this.config.ifselectrow;
this.config.table.ifnav = this.config.ifnav;
this.config.table.ifresize = this.config.ifresize;
//create table title
this.config.tabletitle.id = this.name+".title";
this.config.tabletitle.name = this.name+".title";
this.config.tabletitle.;
this.config.tabletitle.bgColor= this.config.style.headbgcolor;

if (this.config.ifresize)
{
this.config.offset.div = this.$c("DIV");
this.config.offset.div.style.position = "absolute";
this.config.offset.div.style.backgroundColor="#000000";
this.config.offset.div.style.;
this.$addChild({obj:this.config.Dom,node:this.config.offset.div});
this.config.tabletitle.onmousemove = this.titleonmousemove;
this.config.tabletitle.onmousedown = this.titleonmousedown;
this.config.tabletitle.onmouseover = this.titleonmouseover;
this.config.tabletitle.onselectstart = this.titleonselectstart;
window.document.attachEvent("onmouseup", this.titleonmouseup);
window.document.attachEvent("onmousemove",this.titleonmousemove);
this.config.table.splitLine = this.config.offset.div;
this.config.table.splitLine.style.display = "none";
}else{
this.config.tabletitle.style.cursor = "hand";
}

//create table title colums
for (var i=0;i<this.columsobject.length;i++)
{
 var cols = this.config.tabletitle.cells[i];
 cols.id = this.config.tabletitle.id+"."+this.columsobject[i].name;
 cols.name = this.config.tabletitle.id+"."+this.columsobject[i].name;
 cols.noWrap = true;
 cols.;
 cols.col = i;
 cols.style.width = this.columsobject[i].width;
 cols.onfocus = function(){};
 cols.onblur = function(){};
 cols.align = "center";
 cols.ifsort = this.columsobject[i].ifsort;
 cols.sorttype = this.columsobject[i].sorttype;
 if (this.columsobject[i].ifhide){cols.style.display = 'none';}
 cols.title = this.columsobject[i].tips;
 this.setHide({obj:cols,type:this.columsobject[i].ifhide});
 cols.oldtitle = this.columsobject[i].title;
 cols.innerText = this.columsobject[i].title;
 if (this.config.ifresize)
 {
 var _div = this.$c("div");
_div.col = i;
_div.style.borderLeft = "1px solid ButtonHighlight";
//_div.style.borderTop = "1px solid ButtonHighlight";
//_div.style.borderRight = "1px solid ButtonHighlight";
//_div.style.borderBottom = "1px solid ButtonHighlight";
//_div.style.backgroundColor = "ButtonFace";
_div.style.;
_div.style.;
_div.style.marginTop = "2px";
_div.ifsort = this.columsobject[i].ifsort;
_div.sorttype = this.columsobject[i].sorttype;
_div.id = this.name+"."+this.columsobject[i].name+".resize.div";
if (this.columsobject[i].ifsort){
_div.style.cursor = "hand";
_div.ondblclick= me.sortcolums;
_div.title = "双击排序";
}
_div.oldtitle = this.columsobject[i].title;
_div.innerHTML = cols.innerHTML;
cols.innerHTML = "";
cols.appendChild(_div);
//cols.style.borderRight = "1px solid black";
//cols.style.borderBottom = "1px solid ButtonHighlight";
cols.align = "center";
 }else{
         if (this.columsobject[i].ifsort){cols.style.cursor = "hand";cols.ondblclick= me.sortcolums;cols.title="双击排序";}
 }

}

//create table sum
this.config.tablesum = this.$insRow({obj:this.config.table,idx:-1});
this.config.tablesum.id = this.name+".sum";
this.config.tablesum.name = this.name+".sum";
this.config.tablesum.;
this.config.tablesum.bgColor= this.config.style.headbgcolor;
this.config.tablesum.style.cursor = "hand";

//create table sum colums
for (var i=0;i<this.columsobject.length;i++)
{
 var cols = this.config.tablesum.insertCell();
 cols.id = this.config.tablesum.id+"."+this.columsobject[i].name;
 cols.name = this.config.tablesum.id+"."+this.columsobject[i].name;
 cols.noWrap = true;
 cols.;
 cols.width = this.columsobject[i].width;
 if (this.columsobject[i].ifhide){cols.style.display = 'none';}
 cols.align = "right";
 this.setHide({obj:cols,type:this.columsobject[i].ifhide});
 this.$addChild({obj:this.config.tablesum,node:cols});
}

//create nav page
if (this.config.ifnav)
{
var nav = this.$insRow({obj:this.config.table,idx:-1});
nav.id = this.name+".nav.frame";
nav.name = this.name+".nav.frame";
nav.bgColor = this.config.style.navbgcolor;
var td = nav.insertCell();
td.id = this.name+".nav.td";
td.name = this.name+".nav.td";
td.align="left";
td.heigth = "22px";
td.noWrap = true;
td.colSpan = this.columsobject.length;
td.style.cursor = "hand";
var abspan = this.$c("span");
abspan.id = this.name+".aboutus";
abspan.name = this.name+".aboutus";
abspan.style.textAlign="left";
abspan.style.;
abspan.innerHTML = "xGrid©2008";
abspan.title = "xGrid(c)2008rversion 3.0rby code.cn";
this.$addChild({obj:td,node:abspan});
this.config.tablenav = this.$c("span");
this.config.tablenav.id = this.name+".page.nav";
this.config.tablenav.style.;
this.config.tablenav.style.textAlign="right";
this.$addChild({obj:td,node:this.config.tablenav});
this.$addChild({obj:nav,node:td});
}

for (var i=1;i<=this.config.Lines;i++)
{
this.addrow();
}

this.config.processdiv = this.$c("div");
this.config.processdiv.style.;
//this.config.processdiv.style.;
this.config.processdiv.style.marginTop = "2px";
//this.config.processdiv.style.top = (this.config.processdiv.style.top+30);
//this.config.processdiv.style.left = (this.config.tablewidth)/2;
this.config.processdiv.style.fontSize = "9pt";
this.config.processdiv.style.fontFamily = "宋体";
//this.config.processdiv.style.position = "absolute";
this.config.processdiv.noWrap = true;
this.config.processdiv.style.display = 'none';
//processbardiv run function
this.config.processdiv.run = function(msg){
         this.innerHTML = msg;
	 this.hide(false);
}
this.config.processdiv.hide = function(bool){
    if (bool)
    {
       this.style.display = 'none';
    }else{
       this.style.display = 'block';
    }
}

//this.config.processdiv.innerHTML = "";
this.$addChild({obj:this.config.Dom,node:this.config.processdiv});
this.initdata();
}

//this sort string ischinese
this.checkchar = function(char1,char2,mode){
	var charSet=this.config.sort.charMode?this.config.sort.charPYStr:this.config.sort.charBHStr;
	for(var n=0;n<(char1.length>char2.length?char1.length:char2.length);n++){
		if(char1.charAt(n)!=char2.charAt(n)){
			if(mode) return(charSet.indexOf(char1.charAt(n))>charSet.indexOf(char2.charAt(n))?1:-1);
			else	 return(charSet.indexOf(char1.charAt(n))<charSet.indexOf(char2.charAt(n))?1:-1);
			break;
		}
	}
	return(0);
}

//this sort colums
this.sortcolums = function(){
    var col = this.col;
    var colarray = [];
    var uitype = me.columsobject[col].uitype.toLowerCase();
    if (uitype == "delete" || uitype =="sysno"){return false;}
    if (me.config.sort.colums)
    {
       if (me.config.sort.colums.id != this.id)
       {
         me.config.sort.colums.innerHTML = me.config.sort.colums.oldtitle;
       }
    }
    me.config.sort.colums = this;
    var mode = this.sorttype.toLowerCase();
    var istrue = false;
    var title = this.innerHTML;
    title = title.replace("▲","");
    title = title.replace("

提示：您可以先修改部分代码再运行

超酷的js效果,js增删除行,编辑,等

相关文章

精彩推荐