标签：
当页面中存在表格时，表格里的默认内容是在代码中写入的，如果想要在页面上对表格的内容进行编辑修改，应该怎么作？
大体思路为对表格添加点击事件，在点击某个单元格时，给里面添加一个input框，然后当这个input框失去焦点时，将input框里的内容传到原来的单元格里就好了。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>表格即时编辑效果</title> <style type="text/css"> </style> <script type="text/javascript"> window.onload = function(){ var oTd = document.getElementsByTagName("td"); for(var i=0;i<oTd.length;i++){ oTd[i].index = i; oTd[i].onclick = function(){ var a = this.index; var oInput = document.createElement("input"); oInput.value = this.innerHTML; this.innerHTML = ""; //使原来td里的内容消失。 this.appendChild(oInput); oInput.focus(); //让input获取焦点 oInput.onclick = function(e){ e.stopPropagation(); } //阻止事件冒泡； oInput.onblur = function(){ oTd[a].innerHTML = this.value; } } } } </script> </head> <body> <table width=600 height=60 border=1 cellspacing=0> <tr> <td>你好</td> <td>我好</td> <td>大家好</td> </tr> <tr> <td>你好</td> <td>我好</td> <td>大家好</td> </tr> </table> </body> </html>
标签：
原文地址：http://www.cnblogs.com/maxqi/p/5782605.html
