[英]How to make custom validation error message?
How can I make this kind of error message? 如何制作此类错误消息? I am building a login validation form.
我正在建立一个登录验证表。
You may try this as simple as it 您可以尝试这样简单
<input type= "text" name= "name" pattern= "[0-9]" required="required">
You can also set Length 您还可以设置长度
In addition: 此外:
You can use customValidity
api to create custom messages and will use the default tooltip provided by the browser. 您可以使用
customValidity
api创建自定义消息,并将使用浏览器提供的默认工具提示。
DOCS: https://developer.mozilla.org/en-US/docs/Web/API/ValidityState DOCS: https : //developer.mozilla.org/en-US/docs/Web/API/ValidityState
Check bellow a simple example: 下面是一个简单的例子:
https://jsbin.com/popazajawu/2/edit?html,js,console,output https://jsbin.com/popazajawu/2/edit?html,js,console,output
JS: JS:
var inputs = document.querySelectorAll('input');
inputs.forEach(input => {
input.addEventListener('invalid', function(e) {
e.target.setCustomValidity("[CUSTOM MESSAGE] This field cannot be left blank")
})
input.addEventListener('input', function(e) {
e.target.setCustomValidity("");
})
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.