JQuery How to replace strings inside a textarea?

Question

Current Textarea:

<textarea id="event_content"> This text area could be full of information..www.london2012.com And might contain upto 5 links that all need updating. www.rio2016.org Link already converted. this should be left. <a href="http://www.thetimes.co.uk" target="_blank">www.thetimes.co.uk</a> </textarea>

Desired Textarea after jquery: all links to be cleaned/replaced with tags and target attr

<textarea id="event_content"> This text area could be full of information <a href="http://www.london2012.com" target="_blank">www.london2012.com</a> And might contain upto 5 links that all need updating. <a href="http://www.rio2016.org" target="_blank">www.rio2016.org</a> Link already converted. this should be left. <a href="http://www.thetimes.co.uk" target="_blank">www.thetimes.co.uk</a> </textarea>

21 July 2012 - Ωmega's code worked a treat thanks, but could be improved by leaving already converted links?

Your original question was simple, this is somewhat trickier... have a look at using a Regex to identify the url's in the body of the text, then replace them in a similiar manner to Cristy's answer. This question might help stackoverflow.com/questions/5461702/regex-to-find-url-in-a-text — magritte
– magritte, Commented Jul 20, 2012 at 14:56
Yes regex would do it. I can do it in php but not jquery?? preg_replace('!(http://[a-z0-9_./?=&-]+)!i', '<a href="$1">$1</a> ', $text." "); — Harry
– Harry, Commented Jul 20, 2012 at 15:42

Ωmega · Accepted Answer · 2012-07-20 19:18:57Z

9

I believe you are looking for something like this (click here to test this fiddle):

$('#event_content').val( $('#event_content').val().replace(/\b(http(s|):\/\/|)(www\.\S+)/ig, "<a href='http\$2://\$3' target='_blank'>\$3</a>"));

answered Jul 20, 2012 at 19:18

Ωmega

44k35 gold badges143 silver badges213 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Harry Over a year ago

Yes I believe that is the code I was looking for! Could your regex be tweaked to not include links already converted?

Ωmega Over a year ago

@Harry - That would have to be a loop going through all links with storing previous matches and conditional regex replace.

Wouter Janssens · Accepted Answer · 2012-07-20 14:30:30Z

var link = $("#event_content"); var text = link.html(); var linktext = '<a href="' + text + '" target="_blank">' + text + '</a>' link.html(linktext);

XCS · Accepted Answer · 2012-07-20 14:31:43Z

$(function(){ var old = $('#event_content').val(); var news = '<a href="http://'+old+'" target="_blank">'+old+'</a>'; $('#event_content').val(news); });

Note that the <a> will not be displayed in textarea, but instead plain text will be shown.

Demo: http://jsfiddle.net/3xEh2/1/

Good thanks but there is other info in the textarea so I have updated the original question.

Mark K · Accepted Answer · 2012-07-20 14:51:31Z

fiddle

This will replace all the links and leave the other text there as well.

$(function(){ var old = $('#event_content').val(); var news = old.replace("www.london2012.com", '<a href="http://www.rio2016.com" target="_blank">www.rio2016.com</a>'); $('#event_content').val(news); });

Collectives™ on Stack Overflow

JQuery How to replace strings inside a textarea?

4 Answers 4

2 Comments

Comments

1 Comment

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

Comments

1 Comment

Comments

Linked

Related