Geek Answers Handbook

How to highlight a piece of text in textarea

Is there a way to highlight some of the text in textarea.
For Ex: Say the text is "Hello @twitter @twitpic" , and now I would like to highlight only @twitter and @twitpic , not Hi . This should happen on the fly. I do not want to use iframe

Thank you in advance

+6
source share
2 answers

without wrapping the tag around certain words, you cannot highlight it (or, as I said, at least I don’t know how to do it). but if there is no problem with wrapper tags, you should use regEx.

for words starting with @:

replace(/@([^ ]+)/g, '<span class="atsign">@$1</span>');

and for words starting with C #:

 status.replace(/#([^ ]+)/g, '<span class="hashtag">#$1</span>');

check this script

EDIT: you can replace

 var status = 'I tweeted something #one #two @three @four';

with

 var status = $('#phrase').text();
+4
source

Use the setSelectionRange method in this text.

Code example:

 <body> <section> <textarea id="textarea"></textarea> <button id="hgh">Hightlight @twiiter</button> </section> <script> window.onload = function () { var textarea = document.getElementById("textarea"); var checkError = document.getElementById("hgh"); checkError.addEventListener("click", function () { var index = textarea.innerText.indexOf("@twitter"); if( index >= 0) textarea.setSelectionRange(index, index + 8); }); } </script> </body>
+3
source

More articles:


All Articles