【JavaScript】URLを<a>タグで囲ってリンク貼る方法【正規表現】
Posted: 2011年2月01日(火) 20:26
お世話になります。シエルです。
今、ツイッターAPIを使ってつぶやきを取得し、
URLを正規表現でマッチさせ、そのURL部分を<a>タグで囲むことによって、リンクを貼ろうとしているのですが、
うまくいきません。
マッチさせる正規表現はできました。
↓です。これを使えばマッチすることは確認しています。
str=text.match(/https?:\/\/[a-z0-9A-Z\.\/\-~#&%\$!\?=]+/ig)
で、そのマッチした文字を使って、↓で、変換しています。
obj=new RegExp(str,"g");
text=text.replace(obj,"<a target='_blank' class='link' href='"+str+"'>"+str+"</a>");
こうすれば、text内に複数のURLが含まれている場合でも、gオプションを使っているので、そのURLに対して全て変換を行ってくれます。
ですが、上記のmatchでマッチした文字列の中に?などの正規表現で使う文字列が含まれていた場合、
変換を行ってくれません。
恐らく、メタ文字として見られているので、「?」という文字では見られていないからだと思われます。
↑こういうURLがダメになります。
そのほかのURLはこの方法でちゃんとリンクを貼ることができます。
今回はたまたま「?」の文字でしたが、他のメタ文字が含まれていた場合同様の現象が起こるとおもわれます。
何か良い方法はないでしょうか?
よろしくお願い致します。
今、ツイッターAPIを使ってつぶやきを取得し、
URLを正規表現でマッチさせ、そのURL部分を<a>タグで囲むことによって、リンクを貼ろうとしているのですが、
うまくいきません。
マッチさせる正規表現はできました。
↓です。これを使えばマッチすることは確認しています。
str=text.match(/https?:\/\/[a-z0-9A-Z\.\/\-~#&%\$!\?=]+/ig)
で、そのマッチした文字を使って、↓で、変換しています。
obj=new RegExp(str,"g");
text=text.replace(obj,"<a target='_blank' class='link' href='"+str+"'>"+str+"</a>");
こうすれば、text内に複数のURLが含まれている場合でも、gオプションを使っているので、そのURLに対して全て変換を行ってくれます。
ですが、上記のmatchでマッチした文字列の中に?などの正規表現で使う文字列が含まれていた場合、
変換を行ってくれません。
恐らく、メタ文字として見られているので、「?」という文字では見られていないからだと思われます。
↑こういうURLがダメになります。
そのほかのURLはこの方法でちゃんとリンクを貼ることができます。
今回はたまたま「?」の文字でしたが、他のメタ文字が含まれていた場合同様の現象が起こるとおもわれます。
何か良い方法はないでしょうか?
よろしくお願い致します。