查找链接并使其可点击

Question

我正在开发一个与 socketio 的聊天。每次发送消息时，我都会使用这个非常简单的 jquery 来显示它：

            $('#try').prepend(my_message);

与：

            <div id='try'></div>

我想做的是查找发布的消息是否包含链接，如果包含链接，则使其可点击。我需要找到 http:// 和 www。

我发现了几个相关的问题，但没有一个给出我正在寻找的解决方案。

有什么办法可以做到这一点吗？

Answer 1

您应该使用正则表达式将所有 http/https 链接替换为锚标记：

function replaceURLWithHTMLLinks(text) {
    var exp = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
    return text.replace(exp,"<a href='$1'>$1</a>"); 
}

有关更多信息，您可以查看How to replace plain URLs with links? 和Coding Horror: The Problem with URLs。希望这会有所帮助。

Answer 2

对于您聊天中插入的每条新消息，请执行以下操作

var conversation = "This message contains a link to http://www.google.com "
                 + "and another to www.stackoverflow.com";

conversation = conversation.replace(/(www\..+?)(\s|$)/g, function(text, link) {
   return '<a href="http://'+ link +'">'+ link +'</a>';
})



/**
 *  output :
 *  This message contains a link to <a href="http://www.google.com">http:
 *  //www.google.com</a>and another to <a href="http://stackoverflow.com">   
 *  www.stackoverflow.com</a>
 */

然后将新消息重新附加到您的聊天中。