Question

下面是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>

可以请任何人帮助我。我真的很感激...

Answer 1

这是因为您在字段的userInput事件上为focus分配了一个值，当字段为空时，触发了第一次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");
    }
});

Answer 2

删除它：

 $("#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");
        }
    });

Answer 3

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

无需单独进行这些操作。

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

javascript输入验证在第一次尝试时无效

3 个答案: