Comments on: Parsing Twitter Usernames, Hashtags and URLs with JavaScript

By: Eric Atallah

Eric Atallah — Tue, 06 Dec 2011 17:16:00 +0000

Hello,

Is there anyway to add: target=”_blank” to the hyperlink so it opens in a new window/tab?

Thanks!

By: Eric

Eric — Wed, 30 Nov 2011 20:13:00 +0000

Hi,

Great post, this solved my exact problem. However, I still can’t figure out how to make the links open up in a new window/tab. How can we modify the parseURL() function to set the target attribute of the anchor tag to _blank?

Thanks,

-Eric

By: Aran Cloverink Chananar

Aran Cloverink Chananar — Thu, 24 Nov 2011 08:10:00 +0000

thx!

By: andré

andré — Sat, 29 Oct 2011 04:31:00 +0000

Life saver, great code =] thanks

By: A83

A83 — Tue, 18 Oct 2011 14:20:00 +0000

If I would like to add an class to each of these links so I could style hashtags, urls and usernames differently how would I do that?

Thanks!

By: Marcus Bointon

Marcus Bointon — Wed, 28 Sep 2011 10:48:00 +0000

All of the patterns used in here will match things that look like twitter elements but are not, for example # that’s part of a URL, @ that’s part of an email address. They also match misformatted items like @@ and ##. Eduardo Cancino suggested a fix that won’t really work as it will only match at the start of a string (which will catch most replies); you need to enforce that they are not preceeded by a word boundary. Twitter user names can’t contain ‘-’, so that should not be included in the class (which is wrong anyway as ‘-’ has a special meaning unless it’s the last character in a range). Conveniently, the chars allowed in a twitter id are exactly those included in the w class. Twitter IDs are limited to 20 characters, so anything that’s over 20 chars is not a twitter ID, so the pattern should assert that too.

Hashtags are not limited to ASCII, so a better pattern for that should allow anything but whitespace (and by experimentation with twitter’s own client, some punctuation, extend as you like).

So, revised regexes (should work in both PHP and JS) are:

Twitter ID:

/(?!b)@[w]{1,20}(?![w])/

Hashtag:

/(?!b)#[^s.'"]+/

So given this tweet:

#hello @xyz @hello #hashtag nobody@example.com #blah @iamnotatwitteridatall http://www.examplecom/index.php#fragment #<3 #bababa

It should extract @hello and @xyz twitter IDs (but NOT @example or @iamnotatwitteridatall) and #hello, #hashtag, #<3 and #bababa (but NOT #fragment).

By: Eduardo Cancino

Eduardo Cancino — Fri, 15 Jul 2011 16:10:00 +0000

If you have an email address parser the username parser getts it wrong, to correct this:

Just added ^ at the beginning of pattern, hope it helps

p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Monaco}
p.p2 {margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Monaco; color: #413af9}
span.s1 {color: #901a66}
span.s2 {color: #000000}
span.s3 {color: #413af9}
span.Apple-tab-span {white-space:pre}

String.prototype.parseUsername = function() {
return this.replace(/^[@]+[A-Za-z0-9-_]+/g, function(u) {
var username = u.replace(“@”,”")
return u.link(“http://twitter.com/”+username);
});
};

By: Eduardo Cancino

Eduardo Cancino — Fri, 15 Jul 2011 15:33:00 +0000

If you have an email address it recognizes it as twitter username, even if it is on a link

By: Eduardo Hertz

Eduardo Hertz — Thu, 05 May 2011 20:19:00 +0000

The regex to parse hashtags is getting only the first hashtag. If a tweet has two hashtags, for example, it will parse only the first one.

To correct this, just put a “g” in the end of the regex. Like this:

String.prototype.parseHashtag = function() {
return this.replace(/[#]+[A-Za-z0-9-_]+/g, function(t) {
var tag = t.replace(“#”,”%23″)
return t.link(“http://search.twitter.com/search?q=”+tag);
});
};

Thank you for the post!

By: Conor

Conor — Mon, 07 Mar 2011 13:36:00 +0000

Thanks very much for this code. I’ve used it in a Google Maps & Twitter Mashup. Very handy. Cheers