标签：
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 <style> 7 .wrap{ 8 width: 400px; 9 border: 1px solid black; 10 11 } 12 </style> 13 </head> 14 <body> 15 <table id="tr2" class="wrap" border="1"> 16 <tr> 17 <th>姓名</th> 18 <th>成绩</th> 19 <th>性别</th> 20 </tr> 21 22 <tr> 23 <td>张三</td> 24 <td>1</td> 25 <td>女</td> 26 </tr> 27 </table> 28 </body> 29 </html> 30 <script> 31 var t = document.getElementById("tr2"); 32 t.onclick = function(e){ 33 var ev = e||window.event; 34 var obj = ev.target||ev.srcElement; 35 // if(obj.nodeName == "TH"){ 36 // return; 37 // } 38 // alert(obj); 表格元素 39 if(obj.nodeName == "TD"){ 40 var txt = obj.innerHTML; 41 var input = document.createElement("input"); 42 input.setAttribute("type","text"); 43 input.setAttribute("style","width:100px;border:1px solid red"); 44 obj.innerHTML=""; 45 obj.appendChild(input); 46 input.focus(); 47 48 input.onblur = input.onkeydown =input.onclick =function(e){ 49 var ev = e||window.event; 50 if(ev.type=="blur"|| (ev.type=="click") ||(ev.type=="keydown" && ev.ctrlKey && ev.keyCode == "13")){ 51 var i; 52 53 if(input.value.trim()==""){ 54 i = txt; 55 }else{ 56 i = input.value; 57 } 58 obj.innerHTML = i; 59 obj.removeChild(input); 60 61 } 62 } 63 } 64 } 65 </script>
标签：
原文地址：http://www.cnblogs.com/justyq/p/4805432.html
