问题
I'm trying to make a disabled/uneditable text inside a textarea. I've found a trick to have the first part uneditable here How to lock the first word of a textarea? but my problem is making it at the end of the text. But it may even not be a textarea "html-tag" but it must look like that and editable.
I've researched and read a lot, others saying just write it outside and tell them this text will get appended. But yeah. That was my first idea as well.
Is there a jQuery plugin or something easier to do this?
Cheers!
Edit after first comment:
I forgot to mention that I need the uneditable-text to be of a different color so textarea wouldn't probably cut it off.
回答1:
If you use the HTML5 contenteditable attribute, you can achieve something like that.
<div contenteditable>test <span contenteditable="false">asdf</span> asdf</div>
You'll be able to edit text around uneditable portion, but you won't be able to edit the text in that span. You will, however, still be able to delete it by backspace key or selecting/delete.
回答2:
I have something kinda-working-here http://jsfiddle.net/index/tX44C/2/, been working on this a lot already making use of contenteditable attr. But it still has some defects particularly in Safari when the replaceWith triggers, it looses focus. And also, I can't test it on IE browsers, I think some IE have problems with "CSS content".
Is there anything better?
Edit: I've made a few changes to the link I posted above (I also edited the link) and it seems to work very fine for now. I'm quite contented with it so I'll be using this now unless some other solution presents itself.
Clarification:
The code on the fiddle also includes a limitter and some other input boxes cause I was viewing what the contenteditable was having. But in order to have the text on the end side, I used the CSS :after and content attribute and some manipulation to remove br's while typing to keep it on it's side.
Cheers!
回答3:
have a feeling this might not suffice, but i've used it in cases were the signature for a user generated email was fixed. It's just some css trickery.
see jsfiddle
来源：https://stackoverflow.com/questions/11464697/how-to-have-a-disabled-text-in-textarea-like