【问题标题】：Get the first link in Div contenteditable in Javascript在 Javascript 中获取 Div contenteditable 中的第一个链接
【发布时间】：2017-04-04 12:37:29
【问题描述】：

我不知道如何获取 div contenteditable 中的第一个链接（文本类型）。在我的 Div 中，我的值是：

<div id="content" contenteditable="true" value="http://google.com and other string but i only get the link"></div>

我只想得到http://google.com

第二个问题，当值为http://google.com http://yahoo.com 时，我只想获取第一个链接http://google.com。

我在 div contenteditable 中使用 jquery 和 keyup 事件。希望您能帮帮我，谢谢！

更新我的代码：

$(document).ready(function()
{
  $("#content").keyup(function(){
    var link = $("content").text();
    console.log(link);
  });
}

和html

<div id="content" contenteditable="true"></div>

【问题讨论】：

你能在 Jsfiddle 中做一个演示，它会更多地描述它。
显然你有一些代码，请显示它的相关部分。
是的，抱歉，我会更新我的问题
哪个是#txtContent div？
它是content

标签： javascript jquery html

【解决方案1】：

考虑以下代码：

$(document).ready(function() {
  $("#content").keyup(function(){
    var link = $("#content").text().match(/(https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]\.[^\s]{2,}|www\.[a-zA-Z0-9]\.[^\s]{2,})/i)[1];
    
    alert(link);
  });
});

我做了一些更正并添加了正则表达式来匹配 url。

DEMO

【讨论】：