使用 <input type="url"> 处理 HTTP 和 HTTPS

Question

URL 输入<input type="url">的pattern属性允许我们指定一个 JavaScript 正则表达式来验证输入值。

在这个 MDN 示例中，提供的模式是pattern="https://.*"需要一个https协议。这意味着一个http值将不被接受。

<label for="url">Enter an https:// URL:</label>

<input type="url" name="url" id="url"
       placeholder="https://example.com"
       pattern="https://.*" size="30"
       required>

不是所有的 URL 都是HTTPS，所以这个选项太严格了吗？

在解释模式属性的文档中，它说：

如果指定的模式未指定或无效，则不应用正则表达式并完全忽略此属性。

我认为这意味着如果不包含模式属性，则将www.example.com接受的值。然而，情况似乎并非如此。

问题：我们如何使用 url 输入来灵活处理http和https值？此外，如果用户能够在www.example.com不指定协议的情况下简单输入，似乎会更简单。

Answer 1

添加?到模式

pattern="https?://.*"

?使s可选。