允许用户更改div的文本

Question

这只是我另一个问题的疑问。然而，我没有解决方案，所以我重新发布这个问题，希望有人可以解决我的困境。

我有一个div.I希望div内容可以编辑。 我基本上想要的是点击一个按钮，div应该变成一个文本框，并允许用户更改div的内容。我宁愿避免Jquery。

http://jsfiddle.net/qbXcw/11/

HTML

<div id="main">
    <div id="allowedit">CLICK BUTTON TO EDIT THIS TEXT
        <input type="button" value="CLK ME" onclick="changetext(this)" />
    </div>
  <div>

JAVASCRIPT

changetext = function (e) {  
     src=(e.parentNode);
     src.outerHTML="<div><input +"+"name=input"+"></div>";     
}

Answer 1

您可以使用html属性contenteditable

<div contenteditable="true">
  This text can be edited by the user.
</div>

Answer 2

 <div id="allowedit" contenteditable="true">
  CLICK BUTTON TO EDIT THIS TEXT        
 </div>