js实现表格可编辑

竭诚为您提供优质文档/双击可除js实现表格可编辑

篇一：用js实现的表格

"http://

f

152.00

20xx-12-09

点击标题可排序

//添加行

"

functionaddRow(table,index){

varlastRow=table.rows[table.rows.length-1];

varnewRow=lastRow.clonenode(true);

table.tbodies[0].appendchild(newRow);

setRowcanedit(newRow);

returnnewRow;

}

functiondelete_row(rname){

//函数delete_row用于删除一行

vari;

i=window.event.srcelement.parentnode.parentnode.row index;if(confirm(确定删除第+i+行))

tabproduct.deleteRow(i);

}

functionmove_up(rname)

{

//上移一行

vari;

i=window.event.srcelement.parentnode.parentnode.row index;if(i>=2)

change_row(i-1,i);

else

alert(第一行不能上移！);

}

functionmove_down(rname)

{

//下移一行

vari;

i=window.event.srcelement.parentnode.parentnode.row index;if(i change_row(i+1,i);

else

alert(最后一行不能下移！);

}

functionchange_row(line1,line2)

{

//执行交换

tabproduct.rows[line1].swapnode(tabproduct.rows[lin e2]);

}

//转换器，将列的字段类型转换为可以排序的类型：string,int,floatfunctionconvert(sValue,sdatatype){ switch(sdatatype){

case"int":

sdatatype);

sdatatype);

returnparseint(sValue);case"float":returnparseFloat (sValue);case"date":returnnewdate(date.parse(sValue ));default:returnsValue.tostring();}}//排序函数产生器，icol表示列索引，sdatatype表示该列的数据类型functiongeneratecomparetRs(icol,sdatatype){returnfu nctioncomparetRs(otR1,otR2){varvValue1=convert(otR1 .cells[icol].firstchild.nodeValue,varvValue2=conver t(otR2.cells[icol].firstchild.nodeValue,if(vValue1v Value2){return1;}else{return0;}};}//排序方法functionsorttable(stableid,icol,sdatatype){varotabl e=document.getelementbyid(stableid);varotbody=otabl e.tbodies[0];

篇二：14-jquery：实现可编辑的表格

jqueryedit.html：

"http://的jquery示例：可以编辑的表格

-->

123123

456456

jqueryedit.js：

//在页面装载时，让所有的td都拥有一个点击事件$(document).ready(function(){

//找到所有的td节点

vartds=$("td");

//给所有的td节点增加点击事件