Javascript输入验证在第一次尝试时无法工作

javascript input validation is not working on the first try

本文关键字：工作 输入 验证 第一次 Javascript      更新时间：2023-09-26

下面是HTML输入表单的脚本。我的问题是，当我第一次在输入框中输入一些东西时，我得到了错误的结果，但是当我再次关注输入框(单击输入框)，然后取消选择输入框时，我得到了正确的答案!为什么会这样?解决方案是什么?

<input type="email" id="iemail" name="email" class="form-control"></input>
<script>
    var pattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+'.[a-zA-Z]{2,4}$/i;
    var userinput;
    $("#iemail").focus(function(){
        userinput = $("#iemail").val();
    });
    $("#iemail").blur(function(){
        if(pattern.test(userinput)){
            alert("VALID");
        }else{
            alert("not a valid e-mail address");
        }
    });
</script>
有谁能帮帮我吗?

这是因为您在该字段的focus事件上为userInput分配值，这是focus第一次被触发，当该字段为空白时，将意味着userInput被设置为空白值。

您可以将userInput的分配移到blur事件中。

var pattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+'.[a-zA-Z]{2,4}$/i;
$("#iemail").blur(function(){
    var userinput = $("#iemail").val();
    if(pattern.test(userinput)){
        alert("VALID");
    }else{
        alert("not a valid e-mail address");
    }
});

Remove this:

 $("#iemail").focus(function(){
        userinput = $("#iemail").val();
    });

将模糊设置为:

$("#iemail").blur(function(){
        userinput = $("#iemail").val();
        if(pattern.test(userinput)){
            alert("VALID");
        }else{
            alert("not a valid e-mail address");
        }
    });

原因是您将#iemail的值全局地存储在焦点上。在第一次聚焦时，它全局存储一个空字符串，因为您还没有键入任何内容。当你模糊时，它会检查空的全局字符串。第二次聚焦时，它在文本框中有一个值并存储它。

不需要单独做这些事情。

$("#iemail").blur(function(){
    var userinput = $("#iemail").val();
    if(pattern.test(userinput)){
        alert("VALID");
    }else{
        alert("not a valid e-mail address");
    }
});
相关文章：