javascript 自动链接 url 但避免递归

Question

我正在尝试在 javascript 中创建自动链接功能，当用户键入 (ContentEditable div) 时，该功能会自动将网址转换为链接。

我使用这个正则表达式:

var text = 'Some text containing URLs';
var exp = /(\b(http):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
var newtext = text.replace(exp,"<a href='$1'>$1</a>");

上面的代码工作正常，但由于每次用户键入时都会调用该代码，因此会发生递归:

<a href='<a href='<a href=' etc.

如何避免这种情况发生，同时仍让脚本在用户键入时更新文本？

所以问题是(感谢@putvande):如何检查 URL 是否不包含:

<a href='... 

(我不太擅长正则表达式)

Answer 1

您只能匹配那些不以 > 为前缀的 URL 模式。或' 。虽然这可能不是 100% 万无一失，但它应该足以帮助您入门。

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

调用时:

urlify('Some text http://example.com containing URLs');

返回"Some text <a href='http://example.com'>http://example.com</a> containing URLs"

urlify("Some text <a href='http://example.com'>http://example.com</a> containing URLs");

返回"Some text <a href='http://example.com'>http://example.com</a> containing URLs"