检测并显示表单文本区域中的链接

当我在Facebook的“你在想什么？”中输入链接（视频，图像，URL等）时。窗体，它会自动检测链接并将其转换为缩略图，并在文本区域下面进行简要说明。任何人都可以提供给我洞察力或链接，让我继续如何实现这一目标？检测并显示表单文本区域中的链接

来源

2012-09-06 hugo

做一个广泛的程序，检测到链路的域，然后从该链接获取有意义的信息，然后显示在一贯的典型时尚。换句话说，你自己对这一个，因为这不是一段简单的代码。 – thatidiotguy

有一个JavaScript附加到textarea更改事件。 javascript检测textarea的内容是否为url，如果是，则调用web服务访问寻找页面标题，页面描述等的URL（或开放图协议元标记），如果它找到每个标签，然后返回到正确组织的JavaScript。

Facebook也会缓存这个内容，并且如果其他用户发布相同的url，他将使用缓存值而不是重新访问页面。

开放式图形协议meta标签：

http://developers.facebook.com/docs/opengraphprotocol/

来源

2012-09-06 14:51:25 lolol

警告 - 必须离开工作，所以正则表达式不检查。

取链接值并通过查找^http:...[^\s]或^https:...[^\s]的正则表达式运行它并返回这些值。

然后，将这些URL传递给您的服务器，让您的服务器检索文档并返回一个snippit，然后放入您的文档。您必须拥有自己的服务器才能提供帮助，因为Javascript本身具有安全限制。谷歌same origin policy欲了解更多信息。

来源

2012-09-06 14:53:18

使用类似

var input = document.getElementById("textarea"); 
input.addEventListener("change", checkLink(e)); 
input.addEventListener("blur", checkLink(e)); 

function checkText(text){ 
    var exp = "((ht|f)tp(s?))(:((\/\/)(?!\/)))(((w){3}\.)?)([a-zA-Z0-9\-_]+(\.(com|edu|gov|int|mil|net|org|biz|info|name|pro|museum|co\.uk)))(\/(?!\/))(([a-zA-Z0-9\-_\/]*)?)([a-zA-Z0-9])+\.((jpg|jpeg|gif|png)(?!(\w|\W)))"; 
    return text.match(exp); 
} 
function checkLink(e){ 
    //here you would want to use a regular expression and check for http: 

    var regularExpression = !!checkText(e.target.innerHTML); // returns true or false 
    if(regularExpression){ 
     e.target.innerHTML += "<a href='#'><img src="" alt="" /></a>"; 
    } 
}

很好的资源正则表达式 - http://regexlib.com/Search.aspx?k=image&c=-1&m=-1&ps=20

来源

2012-09-06 15:10:51

检测并显示表单文本区域中的链接

回答

相关问题