Javascript 修改 input 验证提示

简介: 版权声明:本文首发 http://asing1elife.com ,转载请注明出处。 https://blog.csdn.net/asing1elife/article/details/82876619 ...
版权声明:本文首发 http://asing1elife.com ,转载请注明出处。 https://blog.csdn.net/asing1elife/article/details/82876619

HTML5 为 form 中的 input 提供了一系列的验证提示,通过 Javascript 可以对验证提示的内容进行自定义

更多精彩

定义一个 input 标签,并添加 required 属性

<input type="text" name="username" required>

定义一个方法,使用 setCustomValidity() 方法添加自定义的验证提示内容

<script type="text/javascript">
function checkInput(input) {
    if (input.value.length < 20) {
        input.setCustomValidity("输入内容不得少于20个字符");
    } else {
        input.setCustomValidity("");
    }
}
</script>

在 input 标签中添加 invalid 属性,指定调用前续方法,并传入当前输入框

<input type="text" name="username" oninvalid="checkInput(this)" required>
目录
相关文章
|
1月前
egg.js 24.18参数验证
egg.js 24.18参数验证
29 0
egg.js 24.18参数验证
|
3月前
|
存储 JavaScript 前端开发
账号登录验证(原生js,本地存储)
账号登录验证(原生js,本地存储)
27 0
|
4月前
|
JavaScript 数据安全/隐私保护
JS正则验证密码
JS正则验证密码
|
5月前
|
JavaScript
js通过input框输入属性和值,改变div的属性
js通过input框输入属性和值,改变div的属性
75 0
|
5月前
|
JavaScript 前端开发
JavaScript实现input框获取系统默认年月日时分秒
JavaScript实现input框获取系统默认年月日时分秒
126 0
|
5月前
|
JavaScript 数据安全/隐私保护
js 常用类型验证
js 常用类型验证
47 0
|
2月前
|
JavaScript 前端开发 PHP
34、文件上传 -- 绕过JS验证
34、文件上传 -- 绕过JS验证
31 0
|
3月前
|
算法 JavaScript
|
3月前
|
JavaScript 算法
JS中如何对<input type=“data“>中值进行运算(JS日期类型如何进行加减)
JS中如何对<input type=“data“>中值进行运算(JS日期类型如何进行加减)
26 0
|
4月前
|
JavaScript 前端开发
JavaScript 获取 input 输入框内容的几种方法
JavaScript 获取 input 输入框内容的几种方法
61 0