html 表格双击事件,js修改table中Td的值(定义td的双击事件)

客户需求至上。

这次是更改后的代码，去掉了“确定”，“取消”按钮。变单击为双击事件，用户按ESC键，取消更改。

//为每个Td添加双击事件

function ReWritable()

{

var tbmian=document.getElementById("tbmain");

//循环，为每行每列添加双击事件，但是，第一行(thead)与最后一行(tfoot)不添加。

for(var i=1;i

{

for(var j=0;j

{

tbmain.rows[i].cells[j].οndblclick=TdDoubleClick;

}

}

}

//定义td的双击事件，为其添加文本框，使用用户可以输入。

function TdDoubleClick()

{

//首先判断是不是该方格已经存在文本框，如果存在，则返回，不重复添加文本框。如果不存在，则添加。

var tdcag=document.getElementById("tdcag");

var tdid=null;

var txtid=null;

var curtd=window.event.srcElement;

if(tdcag!=null)//已经存在，返回。

{

return;

}

//不存在，则添加

tdid=window.event.srcElement;

tdtxt=tdid.innerText;

tdtxt=Trim(tdtxt);

var str="

";

str+="";

str+="

";

tdid.innerHTML=str;

//使文本框获得焦点。

document.getElementById("txtId").focus();

var ctr=document.getElementById("txtId").createTextRange();

ctr.collapse(false);

ctr.select();

}

//去除字符串前后的空格。

function Trim(str)

{

return str.replace(/(^\s*)|(\s*$)/g, "");

}

//定义KeyPress按下时的事件，如果是ESC键，则取消更改，恢复为更改前的值。

document.onkeypress = function EscKeyPress()

{

if(event.keyCode==27)

{

CancelTdChanged();

return;

}

}

//取消更改，

function CancelTdChanged()

{

var tdInitValue=document.getElementById("tdInitValue");

var tdtxt=tdInitValue.value;

var tdid=document.getElementById("tdcag").parentNode;

tdid.innerText=Trim(tdtxt);

}

//确定更改，

function ChangeTdText()

{

var txtId=document.getElementById("txtId");

if(txtId==null)

{

return;

}

var tdid=document.getElementById("tdcag").parentNode;

tdid.innerText=Trim(txtId.value);

return;

}

其它代码，与以前相同。只是取消了对表的Thead与Tfoot的更改。

thead,thead,thead

tfoot,tfoot,tfoot

111213212223313233