文字列中のURLを探してリンクにするJavaScript
正規表現を用いてURLっぽい文字列を探し出し、a要素に置換するサンプル。httpsやh抜きにも対応。
function AutoLink(str) { var regexp_url = /((h?)(ttps?:\/\/[a-zA-Z0-9.\-_@:/~?%&;=+#',()*!]+))/g; // ']))/; var regexp_makeLink = function(all, url, h, href) { return '<a href="h' + href + '">' + url + '</a>'; } return str.replace(regexp_url, regexp_makeLink); }
二行目のコメントは、正規表現(/〜/)を解釈してくれないエディタ等で自動整形を崩さないため。
例:
続きはhttp://www.example.com/で! 続きは<a href="http://www.example.com/">http://www.example.com/</a>で!
"ttps://usr:psw@www.example.com:8080/~usr-dir/path/file_name.exp?param=val&mbstr=%u65E5%u672C%u8A9E#anchor"といった複雑な形式のURLにも対応できています。本当はURLの構成文字群はRFCを参考にしようと思ったけどほとんど読んでません。もしかしたらおかしいかも。
通常はこういうのはCGIやらで行うものなのでしょうが、Ajaxでデータだけ取得してJavaScriptで整形して出力、という場合に使えます。正確に言えば"ftp://"なんかもURLではあるんですが、省略。
参考:
- JavaScriptのString.replace()に関数を与えて高度な正規表現処理をする - NEST :: laboratory
- RFC#1738 - Uniform Resource Locators (URL)
2007/08/12 コードとサンプルを簡素化。