2

div (submitme) を使用して次のコードをトリガーする HTML フォームがあります。コードは bValidator プラグインを使用してフォーム フィールドを検証し、フォームを送信する前にハニーポット フィールドが空白かどうかをチェックします... .

「window.location...」などを除外すると、 .submit() が機能し、フォームを投稿しますが、それを含めると; 検証/ハニーポットは引き続き機能しますが、フォームは送信されません。

私はJQUERYを初めて使用し、単純な何かが欠けているか、以下を書くためのより良い方法があるかどうか疑問に思っていました:

$("#submitme").click(function(){
    if($('#right-body-div').data('bValidator').validate()) {

        if ($("#honeypot").val() == "") {
                $('#pgpost').submit();
                window.location = "http://www.homepage.co.uk/thankyou";    
                return true;
              }
           window.location = "http://www.homepage.co.uk/nothankyou";
           return false;
    }
});

可能であれば、AJAX/PHP を使用せずにこれを実現したいと考えています。

あなたの考えは大歓迎です。

4

1 に答える 1

4
$('#pgpost').submit(function(e) {  // this handles the submit event
    if($('#right-body-div').data('bValidator').validate()) {
        if ($("#honeypot").val() == "") {
            /*
             * url = $('#pgpost').val('action');
             * data = $('#pgpost').serialize();
             * $.post(url, data, function() {
             *     window.location = "http://www.homepage.co.uk/thankyou";
             * });
             */
            window.location = "http://www.homepage.co.uk/thankyou";
        }
        else {
            window.location = "http://www.homepage.co.uk/nothankyou";
        }
    }

    e.preventDefault();
    return false;
    /*
     * the 2 lines above are meant to prevent the normal behaviour
     * that the <form> would have (which is to submit via browser).
     * 
     * e.preventDefault() is the jquery way prevent the normal behaviour
     * return false is the legacy way to do it, you can use either or both
     * 
     * the reason for which the code didn't validate your form is
     * that e.prevenDefault() was only called inside the IF statement
     * which means that it would only be called if the field was
     * already in valid form. So basically if the form was invalid the normal
     * behaviour is not prevented and the browser submits the form, if the form
     * was valid the submit behaviour was prevented and the redirect was used.
     * 
     */
});

$("#submitme").click(function(){
    $('#pgpost').submit(); // this triggers the submit event
}); 

JavaScript を介して送信イベントを処理する場合、次のことができます。

  • 常に通常の動作を防止します (私たちの場合):
  • フォームが無効な場合にのみ、通常の動作を防止します。
    • フォームが有効な場合は、通常の動作を許可します (ブラウザーがデータを送信します)。
    • フォームが無効な場合、エラー メッセージが表示されます。

あなたの場合のエラーメッセージには、ハニーポットが空であってはならないことが示されているはずです。

次の場合、通常の動作を防止することは理にかなっています。- ページの更新を避ける必要があるため、AJAX 経由で送信します。

検証のためだけに、動作を防ぐことは意味がありません。検証してから通常の動作を続行できるためです。

于 2012-05-28T20:42:14.203 に答える