Question

我有一个表单，用户在其中一个字段中填写网址。该地址不会自动变为链接。如何在输入后立即强制浏览器将其转换为链接？

Answer 1

使用<a href="http://example.com">Hey I'm Your Link</a>

Answer 2

您可以在输入失去焦点时或在每次用户击键时设置事件。然后用该库解析输入值：https://github.com/gregjacobs/Autolinker.js 使您的链接显示在您想要的位置。

例如，这里有一些html：

<script src="autolinker.js"></script>
<form>
  <input type="text" name="url" id="url">
  <div id="result"></div>
</form>

还有一些javascript：

document.getElementById("url").addEventListener("blur", function(e) {
  var link = Autolinker.link(this.value);
  document.getElementById("result").innerHTML = '<a href="'+ link + '">' + link + '</a>';
}, false);

这是jsfiddle

希望有所帮助。

Answer 3

这是你在找什么？

HTML ：

<form>
    <label for"url">URL: </label><input type="url" name="utl" id="url-input">
</form>

<强> JQuery的：

$( "#url-input" ).blur(function() {
  var cont = $(this).val();
    $( this ).css('display','none');
    $('FORM').append('<a href="'+cont+'">'+cont+'</a>');
});

非常粗糙：

它没有运行验证以确保内容正确并且实际上是一个URL
它不允许返回输入以修复/更改网址

但是，这是一般的想法吗？

http://jsfiddle.net/bs9oasus/

表单字段中的链接显示为链接

3 个答案: