查看演示效果
织梦DedeCMS视频教程买空间 租服务器 选网硕互联！ 无忧站长工具,百度权重一键全查!
双击文字出现可以编辑的文本框特效，在很多大网站上可以看到，其实不用AJAX也可以实现，就是现在的这款代码，真正想用的朋友可以完善一下提交功能，这样就更完善了。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" mrc="text/html; charset=gb2312" /> <meta name="author" mrc="wuleying" /> <title>双击文本实现编辑</title> <style> input.a {border:1px solid #fff;background:#fff;} input.b {border:1px solid #369;background:#fff;} </style> </head> <body> <input class="a" id="test" readonly value="点我一下可以编辑我" type="text" /><input type="submit" value="提交修改" style="display:none;" id="submit" /> <script type="text/javascript"> var test = document.getElementById("test"); var mysubmit = document.getElementById("submit"); test.ondblclick = function() { this.readOnly = false; this.className = "b"; mysubmit.style.display = ""; } mysubmit.onclick = function() { test.readOnly = true; test.className = "a"; this.style.display = "none"; } </script> </body> </html>