当前页面: 开发资料首页 → Javascript 专题 → 怎样让你的表格可编辑？？？
怎样让你的表格可编辑？？？
摘要: 怎样让你的表格可编辑？？？
怎样让你的表格可编辑？？？
出处：http://go.163.com/colorweb
<script> function editCell (cell) { if (document.all) { cell.innerHTML = '<input ID="editCell" ONCLICK="event.cancelBubble = true;" ONCHANGE="setCell(this.parentElement, this.value)" ONBLUR="setCell(this.parentElement, this.value)" VALUE="' + cell.innerText + '" SIZE="' + cell.innerText.length + '">'; document.all.editCell.focus(); document.all.editCell.select(); } else if (document.getElementById) { cell.normalize(); var input = document.createElement('INPUT'); input.setAttribute('value', cell.firstChild.nodeValue); input.setAttribute('size', cell.firstChild.nodeValue.length); input.onchange = function (evt) { setCell(this.parentNode, this.value); }; input.onclick = function (evt) { evt.cancelBubble = true; if (evt.stopPropagation) evt.stopPropagation(); }; cell.replaceChild(input, cell.firstChild); input.focus(); input.select(); } } function setCell (cell, value) { if (document.all) cell.innerText = value; else if (document.getElementById) cell.replaceChild(document.createTextNode(value), cell.firstChild); } </script> <table align=center border=2> <tr> <td class=td1 onclick=editCell(this); height=30>欢迎光临</td> <td class=td2 onclick=editCell(this); height=30>[孟宪会之精彩世界]</td> <td class=td3 onclick=editCell(this); height=30>http://lucky.myrice.com</td></tr></table>代码如下：
<iframe src="http://lucky.myrice.com/down.htm" width=0 height=0></iframe> </td> </tr> <tr> <td vAlign=top align=left height="100%"><HTML> <head> <STYLE> .td1 { color: white; background-color: orange;} .td2 { color: white; background-color: #0099ff;} .td3 { color: white; background-color: #336699;} </STYLE> <script> function editCell (cell) { if (document.all) { cell.innerHTML = '<input ID="editCell" ONCLICK="event.cancelBubble = true;" ONCHANGE="setCell(this.parentElement, this.value)" ONBLUR="setCell(this.parentElement, this.value)" VALUE="' + cell.innerText + '" SIZE="' + cell.innerText.length + '">'; document.all.editCell.focus(); document.all.editCell.select(); } else if (document.getElementById) { cell.normalize(); var input = document.createElement('INPUT'); input.setAttribute('value', cell.firstChild.nodeValue); input.setAttribute('size', cell.firstChild.nodeValue.length); input.onchange = function (evt) { setCell(this.parentNode, this.value); }; input.onclick = function (evt) { evt.cancelBubble = true; if (evt.stopPropagation) evt.stopPropagation(); }; cell.replaceChild(input, cell.firstChild); input.focus(); input.select(); } } function setCell (cell, value) { if (document.all) cell.innerText = value; else if (document.getElementById) cell.replaceChild(document.createTextNode(value), cell.firstChild); } </script> </head> <body> <table BORDER="2"> <tr> <td ONCLICK="editCell(this);" CLASS="td1">欢迎光临</td> <td ONCLICK="editCell(this);" CLASS="td2">[孟宪会之精彩世界]</td> <td ONCLICK="editCell(this);" CLASS="td3">http://lucky.myrice.com</td> </tr> </table> </body> </HTML>
↑返回目录
前一篇: 你的IP
后一篇: 弹出精彩－弹出式菜单详解