40

有谁知道可以选择对 URL 的所有文本引用并自动将它们替换为指向这些位置的锚标记的脚本？

For example:

http://www.google.com 

would automatically turn into

<a href="http://www.google.com">http://www.google.com</a>

注意：我想要这个是因为我不想浏览我的所有内容并用锚标签包装它们。

4

7 回答 7

57

NOTE: An updated and corrected version of this script is now available at https://github.com/maranomynet/linkify (GPL/MIT licence)

Hmm... to me this seems like the perfect task for jQuery.

...something like this came off the top of my mind:

// Define: Linkify plugin
(function($){

  var url1 = /(^|&lt;|\s)(www\..+?\..+?)(\s|&gt;|$)/g,
      url2 = /(^|&lt;|\s)(((https?|ftp):\/\/|mailto:).+?)(\s|&gt;|$)/g,

      linkifyThis = function () {
        var childNodes = this.childNodes,
            i = childNodes.length;
        while(i--)
        {
          var n = childNodes[i];
          if (n.nodeType == 3) {
            var html = $.trim(n.nodeValue);
            if (html)
            {
              html = html.replace(/&/g, '&amp;')
                         .replace(/</g, '&lt;')
                         .replace(/>/g, '&gt;')
                         .replace(url1, '$1<a href="http://$2">$2</a>$3')
                         .replace(url2, '$1<a href="$2">$2</a>$5');
              $(n).after(html).remove();
            }
          }
          else if (n.nodeType == 1  &&  !/^(a|button|textarea)$/i.test(n.tagName)) {
            linkifyThis.call(n);
          }
        }
      };

  $.fn.linkify = function () {
    return this.each(linkifyThis);
  };

})(jQuery);

// Usage example:
jQuery('div.textbody').linkify();

It attempts to turn all occurrences of the following into links:

  • www.example.com/path
  • http://www.example.com/path
  • mailto:me@example.com
  • ftp://www.server.com/path
  • ...all of the above wrapped in angle brackets (i.e. <...>)

Enjoy :-)

于 2008-10-30T00:19:07.210 回答
14

JQuery 在这里不会为您提供很多帮助，因为您并不真正关心 DOM 遍历/操作（除了创建锚标记）。如果您所有的 URL 都在 <p class="url"> 标签中，那么也许。

一个普通的 JavaScript 解决方案可能是你想要的，就像命运一样，这个人应该让你满意。

于 2008-10-29T16:47:56.577 回答
5

I have this function i call 

textToLinks: function(text) {

    var re = /(https?:\/\/(([-\w\.]+)+(:\d+)?(\/([\w/_\.]*(\?\S+)?)?)?))/g;
    return text.replace(re, "<a href=\"$1\" title=\"\">$1</a>");
  }
于 2012-07-06T09:15:25.147 回答
4

我建议您在呈现到浏览器之前在静态页面上执行此操作，否则您会将转换计算的负担推给可怜的访问者。:) 以下是您在 Ruby 中的操作方式（从标准输入读取，写入标准输出）：

while line = gets
  puts line.gsub( /(^|[^"'])(http\S+)/, "\\1<a href='\\2'>\\2</a>" )
end

显然，您将需要考虑如何使其像您希望的那样健壮。以上要求所有 URL 都以 http 开头，并且将检查不转换引号中的 URL（即，可能已经在 <a href="..."> 内）。它不会捕获 ftp://、mailto:。它会很高兴地转换像 <script> 身体这样的地方的材料，你可能不希望发生这种情况。

The most satisfactory solution is really to do the conversion by hand with your editor so you can eyeball and approve all substitutions. A good editor will let you do regexp substitution with group references (aka back references), so it shouldn't be a big deal.

于 2008-10-29T16:51:42.717 回答
2

Take a look at this JQuery plugin: https://code.google.com/p/jquery-linkifier/

于 2011-08-11T19:55:06.047 回答
1

Doing this server-side is not an option sometimes. Think of a client-side Twitter widget (that goes directly to Twitter API using jsonp), and you want to linkify all the URLs in the Tweets dynamically...

于 2010-09-20T20:56:00.620 回答
0

If you want a solution from another perspective... if you can run the pages through php and HTML Purifier, it can autoformat the output and linkify any urls.

于 2008-10-29T16:57:22.237 回答