HTML5 验证未触发

Question

我正在努力对输入进行客户端验证。我一直在使用 PHP 来完成这一切。不用说事情很快就变得困惑了。因此，我研究了 JS 和 HTML5，并希望进入该系统进行验证。

我要显示的消息是这样的:

我知道这些是用 <input type="email"> 完成的标签。

经过一些帮助，我被指向了这个页面html5rocks .

但是我似乎无法弹出任何内容。我直接从那里的网站复制了代码，什么也没有。

<input id="foo" type="number" max="2" value="1" />
<input id="bar" type="number" max="2" value="3" />
    <script>
        document.getElementById('foo').validity.rangeOverflow; //false
        document.getElementById('bar').validity.rangeOverflow; //true
    </script>

我缺少什么才能显示通知？

Answer 1

该弹出窗口是 HTML5 中的新实现。只需像这样创建一个输入字段:

<input type="email">

如果输入的不是电子邮件地址，则在提交表单时会自动出现弹出窗口。

有关 HTML5 中新输入字段的更多信息，请访问 W3Schools .