我正在使用验证我的输入所需的 html5 属性。我发现一旦表单变得无效,它就无法识别用户何时输入了有效信息。
例如:
<input id="name" type="text" name="username" required oninvalid="setCustomValidity('Please enter a username!')">
如果用户错过了这个字段,它会突出显示红色并告诉用户填写。如果他们然后填写并单击提交,它会告诉用户填写。
表格失效后如何恢复?
我正在使用验证我的输入所需的 html5 属性。我发现一旦表单变得无效,它就无法识别用户何时输入了有效信息。
例如:
<input id="name" type="text" name="username" required oninvalid="setCustomValidity('Please enter a username!')">
如果用户错过了这个字段,它会突出显示红色并告诉用户填写。如果他们然后填写并单击提交,它会告诉用户填写。
表格失效后如何恢复?
声明表单元素无效后不会重新检查。尝试向 oninput 添加一个空的 setCustomValidity 字符串。IE:
<input id="name" type="text" name="username" required oninvalid="setCustomValidity('Please enter a username!')" oninput="setCustomValidity('')" >
我做了类似于@Julie answer的事情,但使用 onchange 而不是 oninput ...
我用于oninvalid
设置自定义有效性错误消息,然后用于onchange
重置消息,以便表单可以正确提交。
<input type="number" oninvalid="this.setCustomValidity('Please enter an INTEGER')" onchange="this.setCustomValidity('')" name="integer-only" value="0" min="0" step="1">