焦点选择器是否无法使用 onfocusout 功能

Question

我有三个文本框 1, 2, 3

如果 textbox1 为空它应该显示一个警报 textbox1 为空并且 textbox1 应该是焦点

如果 textbox2 为空，我应该可以转到 textbox1，但是如果单击 textbox3，它应该显示一个警报，提示文本框 2 为空

如果 textbox1 和 textbox2 不为空，我可以关注 textbox3。

我的代码

<form>
  Text 1 <input type="text" id="text1" onfocusout="check1()" autofocus><br/><br/>
  Text 2 <input type="text" id="text2" onfocusout="check2()"><br/><br/>
  Text 3 <input type="text" id="text3" >
</form>

<script>
    function check1() {
        var x=$("#text1").val();
         
         if(x==""){
            alert("The textbox 1  is empty");
            setTimeout(function() {
                $("#text1").focus();
             }, 100);
            return false;
         }else{
                $("#text2").focus();
         }
    }

    function check2() {
        var y=$("#text2").val();
        
         if($("#text1").is(":focus")){
            $("#text1").focus();
         }else if(y=="" ){
            alert("The textbox 2 is empty")
         }else{
            $("#text3").focus();
         }
    }
</script>

check1() 函数有效，check2() 有一些问题，如何更正

谢谢...

Answer 1

您可以使用focusin事件代替在focusout上验证它。

<form>
  Text 1 <input type="text" id="text1" onfocusin="check(this.id)" autofocus><br/><br/>
  Text 2 <input type="text" id="text2" onfocusin="check(this.id)"><br/><br/>
  Text 3 <input type="text" id="text3" onfocusin="check(this.id)">
</form>
<script>
    function check(id) {
        if(id != "text1" && $("#text1").val() == "")
        {   
            alert("The textbox 1 is empty");
            $("#text1").focus();
        }
        else if(id == "text3" && $("#text2").val() == "")
        {   
            alert("The textbox 2 is empty");
            $("#text2").focus();
        }
    }
</script>