双击网页中的文字即可进行编辑代码,JS代码库,德仔网

代码语言

代码分类

【JS】双击网页中的文字即可进行编辑

作者:bacteroid / 发布于2014/7/2/ 745


	<html>
	 <head>
	 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
	 <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>

试试其它关键字

　双击　　编辑　

同语言下

可能有用的

bacteroid贡献的其它代码(12)