JavaScript 验证 API中的setCustomValidity()方法

分类 : .NET技术

setCustomValidity()办法:

设置 input 元素的 validationMessage 属性,用于自定义错误提示信息的办法。

留意:运用 setCustomValidity 设置了自定义提示后,validity.customError 就会变成true,则 checkValidity() 总是会返回false,招致无论重新输入的格式正确与否,都会提示设置好的错误信息。

处理方法:用obj.validity.patternMismatch判别,假如输入的格式正确,就将setCustomValidity 清空,使JavaScript重新判别validity.customError的值。

参考:

在该链接中,提到三种清空setCustomValidity的办法,但经过测试,只要第一种办法setCustomValidity('')能够运用。

<!DOCTYPE html>

<html>

<head>

   <meta charset="UTF-8">

   <title>未使用setCustomValidity()方法</title>

</head>

<body>

   <form name="test" action="" method="post">

       <input id="input" type="text" required="required" placeholder="请输入4-11位字母加数字的密码" pattern="^(?![0-9]+$)(?![a-zA-Z]+$)[0-9a-zA-Z]{4,14}$" oninput="this.setCustomValidity('')">

       <input type="submit" onclick="setMyText()">

   </form>

   <script type="text/javascript">

       function setMyText(){

           var obj = document.getElementById("input");

           if (obj.validity.patternMismatch === true) {

               obj.setCustomValidity("密码是必填的");

           } else {

               obj.setCustomValidity('');

           }

       }

   </script>

</body>

</html>

相关文章

分类: .NET技术    访问() .NET技术    Web前端    JAVA开发    HTML基础    数据库    CSS基础    电脑知识   
CSS教程-web前端教程-免费教程
HTML教程-web前端教程-免费教程


分类

.NET技术 Web前端 JAVA开发 HTML基础 数据库 CSS基础 电脑知识

随机阅读

方正中楷繁体(FZZKFW)下载大全,什么方正中楷繁体字体下载
经典字体_经典字体下载_经典字体打包下载_网页制作大宝库免费字体下载
请问BODY中的onload是什么意思?
orm表单中的onsubmit怎么使用的?
html body 中onload 属性的作用是什么?
国务院办公厅关于2021年部分节假日安排的通知
Iframe嵌套HTML网页的用法?
Azure Cosmos DB (二) SQL API 操作
html中如果不用frame和iframe,还能怎么在一个区域里显示另
“代码雨”纯HTML源码实现及效果

最新

div css隐藏内容样式方法
OPPO Reno3 Pro远程守护怎么使用?
XP系统里让IE支持多线程下载怎么设置
qq电脑管家温度检测在哪设置的? QQ电脑管家怎么测电脑的温度
win7禁用ie浏览器方法 win7怎么把桌面的ie隐藏
WinXP笔记本声卡驱动无法成功安装的解决方法
XP⁄Win7共享⁄连接打印机设置详细 xp怎
华为笔记本蓝屏错误0xcoooo428怎么解决
企业如何部署微软Windows 8? Windows 8的开发历史
华为mate9怎样解指纹密码?

推荐阅读

c语言中break语句的作用
vscode----vue中HTML代码tab键自动补全
undefined是什么意思啊
js 中日期 转换成时间戳 例如2013-08-30 转换为时间戳
DIV CSS字体(font-family)实现字体样式设置
C语言程序中break是什么意思?
C#语言之“string格式的日期时间字符串转为DateTime类型”
Mysql里表示布尔型的类型是什么
replace和replaceAll是JAVA中常用的交换字符的办法
前端该怎么学?推荐一个学习路线!


Copyright © 2017 CSS5.NET教程.CSS5 内容仅用于学习和测试参考。 css5.net All Rights Reserved 蜀ICP备15003849号-16