58.双击表格变为可编辑

 1 <%@ page language="java" contentType="text/html; charset=UTF-8"
 2     pageEncoding="UTF-8"%>
 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 4 <html xmlns="http://www.w3.org/1999/xhtml" >
 5 <head>
 6 <title>标题页</title>
 7 <script>
 8 function editCell(obj){
 9     if(obj.innerText==""){
10       obj.innerHTML="<input value='' onblur='update(this.value)'>";               //插入输入框，失去焦点时更新
11     }else{
12       obj.innerHTML="<input value="+obj.innerText+" onblur='update(this.value)'>";//插入文本框，且指定内容
13     }
14 }
15 function update(txt){
16     document.getElementById("Td2").innerText=txt;                                //文本框失去焦点时，需要更新表格的内容
17 }
18 </script>
19 </head>
20 <body>
21 <table border="1"><tr><td id="Td2" onDblClick="editCell(this)">第一行第一列</td>
22 </tr></table></body>
23 </html>
posted on 2017-03-05 01:47 Sharpest 阅读(182) 评论(0) 收藏举报