1

私は、ユーザー入力を収集するかなり標準的なHTMLフォームを持っています。ユーザーが入力したデータを検証するJavaScript関数（onClick）を実行する送信ボタンがあります。

関数は次のようになります。

 function validateForm()
  {
    var isValid = true;

    var txtFirstname = document.getElementById("firstName").value;
    var txtLastname = document.getElementById("lastName").value;
    (etc...)



    /*Validate First Name*/
    if(txtFirstname.length <= 0){
        document.getElementById("lblFirstName").innerHTML=" *";
        isValid = false;
    }
    else{
        document.getElementById("lblFirstName").innerHTML="";
        document.getElementById("firstName").value = txtFirstname;
    }


    /*Validate last Name*/
    if(txtLastname.length <= 0){
        document.getElementById("lblLastName").innerHTML=" *";
        isValid = false;
    }
    else{
        document.getElementById("lblLastName").innerHTML="";
        document.getElementById("lastName").value = txtLastname;
    }

    (etc...)




    if(isValid){
        document.formX.submit();
    }
    else{
        return false 
    }

  }

私の質問は、関数がフォームを検証した後、最初の「無効な」テキストボックスにフォーカスを設定するにはどうすればよいですか？

ありがとう、エリック

4

2 に答える 2

1

検証を機能的に分解すると、よりクリーンになります。次に、最初はnullに設定されている「firstInvalidField」という変数を作成できます。フィールドを無効にしたら、firstInvalidFieldがnullかどうかを確認し、nullの場合は、問題のtextBoxに設定します。nullでない場合は、コードをスキップしてください。

検証が完了した後、firstInvalidField変数がnullでない場合は、.focus（）を呼び出します。

于 2012-05-29T15:33:40.433 に答える
1

私はそれを4つ検索し、より人気のある解決策を見つけます：

`$("#"+document.querySelectorAll(":invalid")[1].id).focus();`

それは私のために働いています。Firefoxでの最初の無効な入力のインデックスは0ではなく1であることに注意してください。FFではフォームが無効であり、無効な入力が存在する場合はカウントされます。

于 2014-01-02T10:25:24.097 に答える