jQuery要素を非表示にして問題を解決する

Question

私は基本的にフォームの検証をしようとしています。エバーギングはうまく動作します。一つのことを除いて。まず、ここに私のコードは次のとおりです。

 $('#submit_btn').click(function(){ 

     $("input:not([type=radio],[type=checkbox])").each(function() { 
       if ($(this).val() == ""){ 
       $('#'+$(this).attr("name")+'_error').show(""); 
       } 
       else{ 
        $('#'+$(this).attr("name")+'_error').hide("normal"); 
       } 

      }); 
      if(!($("div[id$=error]").is(":visible"))) 
           alert("a"); 

     }); 

送信ボタンをクリックした後、それはラジオボタンやチェックボックスでない入力をチェックします。入力が空の場合は、エラーが表示されます。

一部の入力が入力された場合、エラーは非表示になります。

最後に、エラーメッセージが表示されているかどうかを確認します。表示されない場合は、フォームを送信します。

私の問題は、.hide（ "normal"）の小さなアニメーションでエラーメッセージを隠すことです。私は最後のエラーメッセージを隠す過程で、私の最後のif文が実行され、可視のエラーメッセージがあると考えています（ただし、非表示になっています）。

if文を実行するには非表示のプロセスが完了した後？

私の場合は、エラーメッセージが残っていない場合、別のクリックして送信ボタンをクリックすると警告が表示されます。

私は私の問題についてはっきりしたいと思います。そうでなければ、私はそれを書き直そうとします。

ありがとうございます！

Answer 1

:visibleでこれを行うのは少しハッキリですが、間違いなく遅いです。代わりに変数を使用してください：

$('#submit_btn').click(function(){ 
    var error = false; 

    $("input:not([type=radio],[type=checkbox])").each(function() { 
     if ($(this).val() == ""){ 
      $('#'+$(this).attr("name")+'_error').show(400); 
      error = true; 
     } 
     else{ 
      $('#'+$(this).attr("name")+'_error').hide(400); 
     } 
    }); 
    if(error) 
     alert("a"); 

}); 

Answer 2

あなたの目標は.hide("normal")機能を使用すると、.hide()関数の引数として「コールバック」機能を渡す必要があり、その後アニメーション終了した後に、警告メッセージを表示する場合。 See the documentation。

は、ここでの例を参照してください：私はあなたがエレガントなフォームの検証プラグインを追求するすべての人の励ましを聞きたいかもしれない、しかし言うだろう

​​

私の2セント...。