小代码——在线编辑表格

一个小代码，给大家拿去发挥
演示：http://www.uikk.com/?uikk.s.do

代码:

<div id="aa"></div>
<table width="80%"  border="1" align="center" bordercolorlight="#CCCCCC" bordercolordark="#FFFFFF" onclick="setEdit(event)" onkeydown="checkAdd(event)">
  <tr>
    <td width="20%"><font color=red>chinahtml.com</font></td>
    <td width="20%">cctv.com</td>
    <td width="20%">baidu.com</td>
    <td width="20%">google.com</td>
    <td width="20%">cncms.com</td>
  </tr>
  <tr>
    <td>im287.cmm</td>
    <td>test.org</td>
    <td>JR.org</td>
    <td>ijsp.net</td>
    <td>phome.net</td>
  </tr>
</table>

<script language="javascript">
oldObj="";
var newNode=document.createElement("input");
newNode.type="text";

function setEdit(e){
    var click_td = e.srcElement? e.srcElement : e.target;
	var obj;
	if(click_td.tagName=="TD"){
		if(oldObj!=""){
            var tobj = document.getElementById('tmpText');
			oldObj.removeChild(tobj);
			if(newNode.vlaue=="") 
              oldObj.innerHTML="&nbsp;";
			else 
              oldObj.innerHTML=newNode.value;
		}
		
		obj=click_td;
		oldObj=obj;
		//newNode.width=obj.clientWidth;
		//newNode.height=obj.clientHeight;
		newNode.width=obj.offsetWidth;
		newNode.height=obj.offsetHeight;

		newNode.id="tmpText";
		newNode.value=obj.innerHTML;
		obj.innerHTML="";
		obj.appendChild(newNode);
		newNode.focus();

	}
    click_td = obj = tobj = null;
}
function checkAdd(e){
    if(e && e.keyCode == 13){
       var obj = e.srcElement? e.srcElement : e.target;
       var t = obj.parentNode.parentNode;
		if(oldObj!=""){
            var tobj = document.getElementById('tmpText');
			oldObj.removeChild(tobj);
			if(newNode.vlaue=="") 
              oldObj.innerHTML="&nbsp;";
			else 
              oldObj.innerHTML=newNode.value;
            oldObj = '';
		}
       if(t.tagName && t.tagName == 'TR'){
         t2 = t.cloneNode(true);
         t.parentNode.insertBefore(t2,t);
       }
    }
    obj = t = tobj = t2 = null;
}
</script>