javascript - 使用 .setCustomValidity() 显示验证消息时出错

问题描述

我对以下代码有疑问。

当我输入无效值时，它可以工作，但如果我不从输入中移除焦点并继续输入数字，则会重复无效消息

        function cargar(){
            let boton=document.getElementById("boton");
            boton.addEventListener("click",comprobar);
        }

        function comprobar(elEvent){
            let valor=document.getElementById("valor");
            let patron=/^[0-9]{3}/;
            if(patron.test(valor.value)){
                valor.setCustomValidity("");
            }else{
                valor.setCustomValidity("Valor incorrecto");
            }
        }

        addEventListener("DOMContentLoaded",cargar,false);

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Ej77</title>
</head>
<body>
    <form action="">
        <label for="valor">Valor: 
            <input type="text" name="valor" id="valor">
        </label>
        <br>
        <input type="submit" value="Comprobar" id="boton">
    </form>
</body>
</html>

例子：

标签： javascript

javascript - 使用 .setCustomValidity() 显示验证消息时出错

问题描述

解决方案

推荐阅读