Question

I want to be able to show additional text in a textarea, like so :.

The cursor would not be able to go “behind” the label “some text”, and clicking on the small cross would remove it.

Is there a jquery plugin that does that ?

EDIT : I figured it couldn’t be a “real” textarea. Is it possible to render “editable” a div ?

Answer 1

Textarea elements may only contain text, they may not contain other HTML elements.

I know you’ve probably seen this effect elsewhere on the web, and I would guess that what you’re seeing in most cases is a complex structure of HTML that is carefully crafted to LOOK like a textarea.

Most likely, this is another element (possibly a div), and inside that you have any other elements stacking to the left, and an input element (not a textarea) with it’s borders, padding, etc removed so that you can’t see it against the fake textarea background. That could achieve the same thing for which you’re looking.

If you really think about it, it doesn’t make much sense to use a real textarea for this problem anyway, since I am guessing you don’t want them entering an entire paragraph, just a few words for each entry. In which case, an input of type text is more appropriate.