javascript - 允许用户更改 div 的文本

Question

这只是我的另一个问题中的一个查询。但是我没有解决方案，所以我重新发布了这个问题，希望有人可以解决我的困境。

我有一个 div。我希望 div 内容是可编辑的。我基本上想要的是一个按钮的onlick 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>