点击后：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <style> body{font-size:14px;} input{border:none;font-size:14px;} .show{} .hide{border:1px solid #ccc;background-color:#eee;width:150px;height:20px;display:none;} </style> <script language="javascript"> <!-- function $(e){ return document.getElementById(e); } function edit(e){ $(e).style.display="none"; $(e+"fm").style.display="block"; $(e+"fm").childNodes[0].focus(); } function hide(e){ $(e).style.display="none"; $(e=e.replace("fm","")).style.display="block"; } --> </script> </HEAD> <BODY> <div class="show" id="test" onclick="edit(this.id)">可编辑的内容一</div> <div class="hide" id="testfm"><input type="text" name="nn" value="可编辑的内容一" onBlur="hide(this.parentNode.id)" /></div> </div> </BODY> </HTML>
