How to make an editable text in HTML
Sometime making a text element editable makes sense such as div
, span
or p
than having to create a text input
field.
We can do the same using the contenteditable
attribute of those elements.^_^
html
<head><style>div {cursor: pointer;}div:focus {cursor: text;}</style></head><body><div contentEditable="true">This is editable!</div></body>
It comes really handy with one-way binding situations with frameworks like Angular/React/Vue.\O/
contenteditable
attribute is only available in HTML5 O_o