在单击位置编辑Div文本

Question

I have a DIV which contains some text. When a user clicks on some content in the DIV, I want to enable him to edit the content at that position.

<div id='Note'>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, <br />
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <br />
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip <br />
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse <br />
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, <br />
sunt in culpa qui officia deserunt mollit anim id est laborum.<br />
</div>

Answer 1

contenteditable will do it in IE 5.5+, Firefox 3.0+, Safari 1.3+, Opera 9+, Chrome:

<div id="Note" contenteditable="true">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, <br />
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <br />
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip <br />
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse <br />
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, <br />
sunt in culpa qui officia deserunt mollit anim id est laborum.<br />
</div>

Answer 2

May be you should use <textarea> element. Then you can edit text inside it at any position.