完整的例子：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.
<html xmlns="http://www.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>DIV编辑</title>
<style type="text/css">
<!--
#div1 {
width: 120px;
border: 1px solid #FF9900;
line-height: 20px;
text-align: left;
text-indent: 5px;
background-color: #FFFFCC;
float: left;
}
#editBt {
width: auto;
margin-left: 5px;
float: left;
}
-->
</style>
</head>
<body>
<br />
<div><div id="div1" >我的原始内容！</div>
<div id="editBt" style="display:none"><input type="button" id="sss" value="编 辑"/> <input type="button" id="rrrr" value="取 消"/></div>
</div>
<script>
var oldText;
init();
function init()
{
var dobj=document.getElementById("div1");
var etobj=document.getElementById("editBt");
var submitbt=document.getElementById(String(etobj.firstChild.id));
var resitbt= document.getElementById(String(etobj.lastChild.id));
oldText=dobj.innerHTML;
dobj.ondblclick=function(){showEditDiv(dobj,etobj);}
submitbt.onclick=function(){edit(dobj,etobj);}
resitbt.onclick=function(){resits(dobj,etobj);}
}
/*
*切换到编辑状态
*/
function showEditDiv(d,et){
if(!d.isContentEditable){
d.contentEditable = true;
et.style.display="";
}
}
/*
* 获取编辑后的内容
*/
function edit(d,et){
var divText;
if(d.isContentEditable)
{
divText=d.innerHTML;
d.contentEditable =false;
et.style.display="none";
alert(divText);
}
}
/*
* 取消编辑
*/
function resits(od,et)
{
od.innerHTML=oldText;
od.contentEditable =false;
et.style.display="none";
}
</script>
</body>
</html>
