HTML5表单必填属性。设置自定义验证消息?
用途setCustomValidity):
document.addEventListener('DOMContentLoaded', function() { var elements = document.getElementsByTagName('INPUT'); for (var i = 0; i < elements.length; i++) {elements[i].oninvalid = function(e) { e.target.setCustomValidity(''); if (!e.target.validity.valid) {e.target.setCustomValidity('This field cannot be left blank'); }};elements[i].oninput = function(e) { e.target.setCustomValidity('');}; }})
我已按照@itpastorn在评论中的建议,从Mootools更改为VanillaJavaScript,但如有必要,您应该可以设计出等效的Mootools。
我在这里更新了代码,其setCustomValidity工作方式与我最初回答时所了解的略有不同。如果setCustomValidity设置为空字符串以外的任何其他值,则将导致该字段被视为无效;因此,您必须在测试有效性之前清除它,而不能只是设置它而忘记。
正如下面@thomasvdb的注释中指出的那样,您需要在某些事件之外清除自定义有效性,invalid否则可能需要通过oninvalid处理程序进行额外的清除操作。
解决方法我有以下HTML5表单:
<form onsubmit='return(login())'><input name='username' placeholder='Username' required /><input name='pass' type='password' placeholder='Password' required/><br/>Remember me: <input type='checkbox' name='remember' value='true' /><br/><input type='submit' name='submit' value='Log In'/>
目前,当我将两个都空白时按Enter键时,会出现一个弹出框,提示“请填写此字段”。如何将默认消息更改为“此字段不能为空”?
还请注意,类型密码字段的错误消息很简单*****。要重新创建此名称,请为用户名指定一个值,然后单击“提交”。
我正在使用Chrome 10进行测试。请同样做
相关文章:
1. mysql - SQL语句可以提供“查询表,并至第100条结果为止”吗?2. javascript - 前端开发 本地静态文件频繁修改,预览时的缓存怎么解决?3. android - 类似这样的recyclerview滑动效果4. python - xpath提取网页路径没问题,但是缺失内容?5. node.js - JavaScript的一个不能理解的地方6. javascript - 给某个类添加一个伪类,这个类有click事件,现在我点击伪类也触发了click事件7. python - 正则表达式中,如果匹配到的字符串后一半刚好是下一个匹配字符串的前一半,怎么实现?8. javascript - 如何彻底禁止平板电脑上浏览器的手势缩放功能9. javascript - js一个call和apply的问题?10. Eclipse / Java-导入java。(namespace)。*是否有害?
