Skip to content

Instantly share code, notes, and snippets.

@inmyfree
Created November 21, 2012 08:47
Show Gist options
  • Save inmyfree/4123861 to your computer and use it in GitHub Desktop.
Save inmyfree/4123861 to your computer and use it in GitHub Desktop.
edittable
<html>
<head>
<meta http-equiv = "content-type" content = "text/html" charset = "gb2312" >
<title>楼盘投票系统_Page1</title>
</head>
<body>
<table>
<tr>
<td class="td2input">11111111111</td>
</tr>
<tr>
<td class="td2input">11111111111</td>
</tr>
<tr>
<td class="td2input">11111111111</td>
</tr>
<tr>
<td class="td2input">11111111111</td>
</tr>
</table>
<script>
function addEvent(obj, type, fn){
if (obj) {
if (obj.addEventListener) {
obj.addEventListener(type, fn, false);
} else if (obj.attachEvent) {
var funIe = function(){
fn.call(window.event.srcElement);
};
obj.attachEvent("on" + type, funIe);
} else{
obj["on" + type] = fn;
}
};
}
var removeEvent = function(obj, type, fn){
if(obj){
if (obj.removeEventListener) {
obj.removeEventListener(type, fn, false);
} else if (obj.detachEvent) {
obj.detachEvent("on" + type, fn);
} else {
obj["on" + type] = null;
}
}
};
var ip = document.createElement("input"),currentCell;
var td2input = function(event) {
event == null ? currentCell=window.event.srcElement : currentCell=event.target;
ip.value=currentCell.innerHTML;
currentCell.innerHTML = "";
ip.onblur = blurDo;
currentCell.appendChild(ip);
ip.focus();
removeEvent(currentCell, "dblclick", td2input);
};
function blurDo(event) {
currentCell.innerHTML = ip.value;
if(event != null)
addEvent(currentCell, "dblclick", td2input);
}
var i,j,tp = new Array();
var tdInput = document.getElementsByTagName("td");
for(i = 0, j = 0; i < tdInput.length; i++)
if(tdInput[i].className == "td2input")
tp[j++] = tdInput[i];
for(i = 0; i < tp.length; i ++)
addEvent(tp[i], "dblclick", td2input);
</script>
</body>
</html>
<html>
<head>
<title></title>
</head>
<body>
<table id="editTable" border="1">
<tr>
<td>aaaaaaa</td>
<td>bbbbbbb</td>
<td>ccccccc</td>
</tr>
<tr>
<td>ddddddd</td>
<td>eeeeeee</td>
<td>fffffff</td>
</tr>
<tr>
<td>gggggggg</td>
<td>hhhhhhhh</td>
<td>iiiiiiii</td>
</tr>
</table>
</body>
</html>
<script>
//dom创建文本框
var input = document.createElement("input");
input.type="text" ;
//得到当前的单元格
var currentCell ;
function editCell(event)
{
if(event==null)
{
currentCell=window.event.srcElement;
}
else
{
currentCell=event.target;
}
//根据Dimmacro 的建议修定下面的bug 非常感谢
if(currentCell.tagName=="TD"){
//用单元格的值来填充文本框的值
input.value=currentCell.innerHTML;
//当文本框丢失焦点时调用last
input.onblur=last;
input.ondblclick=last;
currentCell.innerHTML="";
//把文本框加到当前单元格上.
currentCell.appendChild(input);
//根据liu_binq63 的建议修定下面的bug 非常感谢
input.focus();
}
}
function last()
{
//充文本框的值给当前单元格
currentCell.innerHTML = input.value;
}
//最后为表格绑定处理方法.
document.getElementById("editTable").ondblclick=editCell;
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment