js——自定义：checkValidity( )和setCustomValidity( )

最新推荐文章于 2021-05-31 08:24:57 发布

肖ZE

最新推荐文章于 2021-05-31 08:24:57 发布

阅读量4.1k

点赞数

分类专栏： javascript

本文链接：https://blog.csdn.net/lucky541788/article/details/82078738

版权

javascript 专栏收录该内容

89 篇文章 2 订阅

订阅专栏

checkValidity( )：input元素中的数据合法返回true，反之返false
setCustomValidity( )：设置validationMessage属性值，用于自定义提示
validationMessage：输出提示

<body>
<p>输入数字并点击验证按钮：</p>
<input type="number" id="nu" max="300" min="100" required>
<button type="button" onclick="myFunction()">click</button>
<p>如果输入数字100-300以外，会提示错误信息。</p>
<p id="demo"></p>
</body>


<script>
    function myFunction() {
        var x = document.getElementById("nu");
        x.setCustomValidity("");//使用前先取消自定义，否则下次点击checkValidity总返false
        if (x.checkValidity() == false) {
            x.setCustomValidity("错误");
            document.getElementById("demo").innerHTML = x.validationMessage;
        }
        else {
            x.setCustomValidity("正确");
            document.getElementById("demo").innerHTML = x.validationMessage;
        }
    }
</script>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

肖ZE

关注关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
js——自定义：checkValidity( )和setCustomValidity( )

checkValidity( )：input元素中的数据合法返回true，反之返false setCustomValidity( )：设置validationMessage属性值，用于自定义提示 validationMessage：输出提示&lt;body&gt;&lt;p&gt;输入数字并点击验证按钮：&lt;/p&gt;&lt;input type="number" id="nu"...
复制链接

扫一扫