代码之家 › 专栏 › 技术社区 › Elijah Manor

jquery文本到链接脚本?[复制品]

anchor html jquery javascript

Elijah Manor · 技术社区 · 17 年前

这个问题已经有了答案:

How to replace plain URLs with links? 21答

有人知道一个脚本可以选择所有对URL的文本引用,并自动用指向这些位置的定位标记替换它们吗?

For example:

http://www.google.com 

would automatically turn into

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

注意:我想要这个,因为我不想浏览我所有的内容,并用锚标记将它们包装起来。

7 回复 | 直到 8 年前

Community Mohan Dere 9 年前

jquery在这里不会帮你很多忙,因为你并不真正关心DOM遍历/操作(除了创建锚标记)。如果您的所有URL都在<p class=“url”>标记中,那么可能是。

一个普通的javascript解决方案可能是你想要的,正如命运所愿, this guy should have you covered .

CÅur Gustavo Armenta 8 年前

注: 此脚本的更新和更正版本现在位于 https://github.com/maranomynet/linkify (GPL/MIT许可证)

隐马尔可夫模型。。。对我来说,这似乎是jquery的完美任务。

…我突然想到了这样的事情:

// 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();

它尝试将以下所有事件转换为链接:

www.example.com/path
http://www.example.com/path
mailto:me@example.com
ftp://www.server.com/path
…以上全部用尖括号(即 < … > )

享受:-

Kimtho6 13 年前

我有这个我调用的函数

textToLinks: function(text) {

    var re = /(https?:\/\/(([-\w\.]+)+(:\d+)?(\/([\w/_\.]*(\?\S+)?)?)?))/g;
    return text.replace(re, "<a href=\"$1\" title=\"\">$1</a>");
  }

Your Common Sense 17 年前

我建议您在呈现到浏览器之前在静态页面上执行此操作,否则您将把转换计算的负担推给可怜的访问者。:)下面是在Ruby中实现这一点的方法(从stdin读取,向stdout写入):

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

很明显,你会想办法让它像你想要的那样强大。上面要求所有URL都以HTTP开头,并选中“不转换引号中的URL”(即,它可能已经位于<a href=“…”>)中)。它不会捕获ftp://,mailto:。它将很乐意在<script>body等您可能不希望发生的地方转换材质。

最令人满意的解决方案是与您的编辑手工进行转换,这样您就可以目不转睛并批准所有替换。 A good editor 将允许您使用组引用(即back-references)进行regexp替换,因此这不应该是什么大问题。

MauroPorras Damien MATHIEU 14 年前

看看这个jquery插件: https://code.google.com/p/jquery-linkifier/

mynameistechno 15 年前

有时做服务器端不是一个选项。想想一个客户端的twitter小部件(它使用jsonp直接进入twitter API),你想动态链接twitter中的所有URL…

DGM 17 年前

如果你想从另一个角度来解决问题…如果您可以通过php和html净化器运行页面,它可以自动格式化输出并链接任何URL。