It’s not well known but this feature was invented by Microsoft and has been implemented across all major modern browsers ever since IE 5.5. Adding an attribute of contenteditable and assign a value of “true” to it makes the content value / inner text of that element editable by a single click:
<blockquote contenteditable="true">Click to edit me!</blockquote>Try it live:
Click to edit me!
When you are done editing, just hit Enter (if it’s an inline element) or blur the cursor focus from the editing region (if it’s a block element). Theoretically, this attribute can be added to any HTML tags to make them immediately editable without the help of any JavaScript at all. You can add it to a div, a span or a td.
Now what can we do with this new trick?
This is a great find – thanks!
I found this page: http://code.google.com/p/doctype/wiki/ContenteditableAttribute
It has a small compatibility table for this attribute. No support in FF2, but this page: http://www.w3schools.com/browsers/browsers_firefox.asp shows that (as far as these stats go at least) there are few people still using FF.
Don’t know how I’m going to use this either!
Let us know when you get some ideas?
Hmmm, then I guess I’ll have to resist the idea to use it on any mission critical websites, but maybe hobby or experimental ones.
I’m trying to find a way to submit the edited content to the server, but thus far haven’t been lucky without JavaScript to help pass the value.
is same as