首页 > 编程语言 >JavaScript验证API

JavaScript验证API

时间:2023-01-16 21:23:20浏览次数:45  
标签:inpobj setCustomValidity false 验证 JavaScript checkValidity API

验证API

两个方法:

checkValidity():如果input元素中的数据是合法的返回true,否则返回false;

setCustomValidity():设置input元素的validationMessage属性,用于自定义错误提示信息的方法

使用setCustomValidity设置自定义后提示后,validity.customError就会变成true,checkValidity总会返回false。如需重新判断需要取消自定义提示:

setCustomValidity('')

setCustomValidity(null)

setCustomValidity(undefined)

 

checkValidity()方法

例:

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title>javascript 验证API</title>
 6     </head>
 7     <body>
 8         <p>输入数字并验证</p>
 9         <input type="number" id="id1" min="100" max="300" required>
10         <button onclick="myFunction()">验证</button>
11         <p id="demo"></p>
12     </body>
13     <script>
14         function myFunction(){
15             // 获取用户输入对象
16             var inpobj = document.getElementById("id1");
17             console.log(inpobj)
18             // checkValidity():如果用户输入是合法的,返回true,否则返回false
19             if(inpobj.checkValidity() == false){
20                 document.getElementById("demo").innerHTML=inpobj.validationMessage;
21             }
22             else{
23                 document.getElementById("demo").innerHTML="nice got it..."
24             }
25         }
26     </script>
27 </html>

 

标签:inpobj,setCustomValidity,false,验证,JavaScript,checkValidity,API
From: https://www.cnblogs.com/wenzm/p/17056313.html

相关文章

  • JavaScript学习笔记—函数中的this
    this函数在执行时,JS解析器每次都会传递进一个隐含的参数,即thisthis会指向一个对象,所指向的对象会根据函数调用方式的不同而不同(1)以函数形式调用时,this指向的是window(2......
  • JavaScript 回调函数
    函数实际上是对象:它们能被“存储”在变量中,能作为函数参数被传递,能在函数中被创建,能从函数中返回;回调函数回调函数就是一个参数,将这个函数作为参数传到另一个函数里面,当......
  • 实测 | Apipost和Apifox哪个更好用?
     Apipost和Apifox是国内做的比较好也比较出名的接口调试工具,有不少人都在问这两个工具有什么区别?恰好两个工具我都比较深度的使用过,从初学者到现在也算比较精通一些了,今天......
  • vue3.2 + element-plus 表单嵌套表格实现动态表单验证
    借鉴了这位兄弟的思想,进行了优化和vue3.2语法糖改造:https://blog.csdn.net/weixin_45295253/article/details/115582504实现:<template><el-formref="formRef":mod......
  • OpenApi3.0 Authorization 配置
    @BeanpublicOpenAPIrestfulOpenApis(){returnnewOpenAPI().info(newInfo().title("SpringBoot3.0RestfulOpenAPI")......
  • JavaScript 请求服务端接口
    JavaScript中请求服务端接口的代码实现可能会因为使用的方法而有所不同。1、使用XMLHttpRequest:varxhr=newXMLHttpRequest();xhr.open("GET","https://example.c......
  • 自动化测试验证码问题
    1.验证码作用不少网站在用户登录、用户提交信息等登录和输入的页面上使用了验证码技术。验证码技术可以有效防止恶意用户对网站的滥用,使得网站可以有效避免用户信息失窃......
  • spring boot 图文验证码(Kaptcha)使用
    如何使用可以直接去官网http://code.google.com/p/kaptcha/下载jar,或者在pom.xml中导入` <groupId>com.baomidou</groupId> <artifactId>kaptcha-spring-boot-sta......
  • JavaScript async/await 的用法以及它与 Promise 的区别
    async/await是JavaScript中的语法糖,用于简化异步代码的编写。它允许你在异步代码中使用同步风格的语法,使代码更易于阅读和维护。用法:使用关键字async声明一个异步......
  • javascript中怎么将字符串转换为函数
    要将字符串转换为函数“ eval() ”,应使用方法。此方法将字符串 作为参数并将其转换为函数。语法eval(string);示例在以下示例中,在字符串本身中,使用函数分配了一个名......