html - Edge 和 Safari 的 HTML5 输入 URL 验证

Question

我正在尝试确保用户在其中输入正确的 URL

<input type='url' >

但是测试了一些错误的测试条目，这些条目似乎仅在 Edge (40.15063.0.0) 和 Safari (5.1.7) 上作为 URL 传递。

例如：

http://

https://

这些测试在 Chrome 和 Firefox 中会提示“请输入 url”。如何改进 input type='url' 以不接受 Edge 和 Safari 中的此类条目？

您可以在这里测试类型 url： https ://www.wufoo.com/html5/types/3-url.html

Answer 1

使用模式属性捕获测试用例：http:// https://

<form action="/action_page.php">
Homepage: <input type="url" name="website" pattern="https?://.+" 
title="Include http://">
<input type="submit">
</form>

如 W3schools 文档的最后一个示例所示： https ://www.w3schools.com/tags/att_input_pattern.asp