Ajax动态报表，可适时添加行、删除行、复制行
日期：2014-05-16 浏览次数：20693 次
Ajax动态表格，可适时添加行、删除行、复制行
?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<HEAD>
<TITLE>JavaScript仿Excel表格演示</TITLE>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<SCRIPT type=text/JavaScript>
var toBeColor = "#F8F9FC";
var backColor = "#FFFFFF";
var tableId = "tbData";
var table;
var tbody;
var divShowInput;
window.onload=function(){
beginListen();
table = document.getElementById(tableId);
tbody = table.getElementsByTagName("tbody")[0];
actionFill ();
otherFill();
creatDiv();
divShowInput = document.getElementById("divShowInput");
}
function creatDiv(){
var filldiv = document.createElement("div");
filldiv.setAttribute("id","divShowInput");
var barp = document.createElement("p");
barp.setAttribute("id","barTitle");
barp.onclick=hideDiv;
var defComP = document.createElement("p");
defComP.setAttribute("id","defComP");
defComP.onclick=hideDiv;
var cleara = document.createElement("a");
cleara.setAttribute("href","javascript:void 0");
cleara.onclick=clearInput;
var clearatext = document.createTextNode("清空");
cleara.appendChild(clearatext);
defComP.appendChild(cleara);
var autoP = document.createElement("P");
autoP.setAttribute("id","autoFillP");
filldiv.appendChild(barp);
filldiv.appendChild(defComP);
filldiv.appendChild(autoP);
document.body.appendChild(filldiv);
}
function actionFill (){
var dbinputs = tbody.getElementsByTagName("input");
for (var i = 1;i<=dbinputs.length-1;i++){
dbinputs[i].onfocus=stopListen;
dbinputs[i].onblur=beginListen;
dbinputs[i].ondblclick=showDiv;
dbinputs[i].onmouseover=onChangTrColor;
dbinputs[i].onmouseout=outChangTrColor;
dbinputs[i].onclick=readyedit;
dbinputs[i].onkeydown=gonext;
}
}
function otherFill (){
var Bt_selectAll = document.getElementById("Bt_selectAll");
Bt_selectAll.setAttribute("href","javascript:void 0");
Bt_selectAll.onclick=selectAll;
var Bt_delSelect = document.getElementById("Bt_delSelect");
Bt_delSelect.setAttribute("href","javascript:void 0");
Bt_delSelect.onclick=delSelect;
var Bt_copySelect = document.getElementById("Bt_copySelect");
Bt_copySelect.setAttribute("href","javascript:void 0");
Bt_copySelect.onclick=copySelect;
var Bt_allclear = document.getElementById("Bt_allclear");
Bt_allclear.setAttribute("href","javascript:void 0");
Bt_allclear.onclick=allClear;
var Bt_sendData = document.getElementById("Bt_sendData");
Bt_sendData.setAttribute("href","javascript:void 0");
Bt_sendData.onclick=sendData;
}
function Ajax(url,recvT,stringS,resultF) {
this.url = url;
this.stringS = stringS;
this.xmlHttp = this.createXMLHttpRequest();
this.resultF = resultF;
this.recvT = recvT;
if (this.xmlHttp == null) {
alert("erro");
return;
}
var objxml = this.xmlHttp;
var othis = this;
objxml.onreadystatechange = function (){othis.handleStateChange()};
}
Ajax.prototype = {
createXMLHttpRequest:function() {
try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) {}
try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {}
try { return new XMLHttpRequest(); } catch(e) {}
return null;
},
createQueryString:function () {
var queryString = this.stringS;
return queryString;
},
get : function () {
url = this.url;
var queryString = url+"?timeStamp=" + new Date().getTime() + "&" + this.createQueryString();
this.xmlHttp.open("GET",queryString,true);
this.xmlHttp.send(null);
},
post : function() {
url = this.url;
var url = url + "?timeStamp=" + new Date().getTime();
var queryString = this.createQueryString();
this.xmlHttp.open("POST",url,true);
this.xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
this.xmlHttp.send(queryString);
},
handleStateChange : function () {
var xmlhttp = this.xmlHttp;
var recvT = this.recvT;
var resultF = this.resultF;
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
resultF.cal
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
