如何将锚标记添加到字符串中的 URL

Question

我有一些包含 youtube 链接（字符串中的长度和位置不同，并非每个字符串都包含 URL）和文本的字符串。这些字符串将被写入段落标签，但我希望 URL 是可点击的，所以我需要 URL 周围的锚标签。

我设法找到了访问包含链接的段落的方法：

if($("#facebookFeed p:contains('http')").length){
    //do stuff
}

我被困在这里，不确定这是否是正确的方法。

Answer 1

您必须使用正则表达式来匹配字符串中的 URL，然后将它们包装在锚中：

$('p:contains("http://")').html(function(index, html) {
    var url = html.match(/(((ftp|https?):\/\/)[\-\w@:%_\+.~#?,&\/\/=]+)|((mailto:)?[_.\w-]+@([\w][\w\-]+\.)+[a-zA-Z]{2,3})/g);

    $.each(url, function(i, v) {
        html = html.replace(v, '<a href="' + v + '">' + v + '</a>');        
    });

    return html;
});

上面的例子使用了this answer中的正则表达式模式

Here's a fiddle

Answer 2

下面会做

$("#facebookFeed p:contains('http')").each(function() {
    $(this).wrapInner('<a href="' + $(this).text() + '"/>');
});

如下所示：http://jsfiddle.net/uyHQ2/

当然，这假定了某种 HTML 布局。 如果您的不同，请发布 HTML 示例。