Do you know how to make a <div>
editable with JavaScript? I'm looking for cross-browser solution.
Something similar to a rich text area, but that uses an editable <iframe>
. I need something similar for a <div>
.
I don't want to use a replacement textbox.
Answer: Use the HTML5 contenteditable Attribute You can set the HTML5 contenteditable attribute with the value true (i.e. contentEditable="true" ) to make an element editable in HTML, such as <div> or <p> element.
To edit the content in HTML, we will use contenteditable attribute. The contenteditable is used to specify whether the element's content is editable by the user or not. This attribute has two values. true: If the value of the contenteditable attribute is set to true then the element is editable.
You can add the contenteditable="true" HTML attribute to the element (a <div> for example) that you want to be editable. If you're anticipating a user to only update a word or two within a paragraph, then you could make a <p> itself editable.
All you have to do is set the contenteditable attribute on nearly any HTML element to make it editable.
I found out how.
You use the contentEditable property of the DOMElement, like so
<div onClick="this.contentEditable='true';"> lorem ipsum dolor lorem ipsum dolorlorem ipsum dolor </div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With