0

ここで探しているものに対する答えが見つかりませんでした。ユーザー名がデータベースに存在するかどうかを確認するためにajaxを使用しています。ユーザーが存在する場合、フォームにエラーが表示されます。しかし、そのエラーが存在する場合、フォームが送信されないようにしようとしています。event.preventDefault() を試してみましたが、正しく使用しているか、間違って使用しているかわかりません。

私のJSコードは次のとおりです。

$(".check").blur(function () {
    var username = $(".check").val();
    $.ajax({
        url: "validateUser.php",
        type: "post",
        data: "username=" + username
    }).done(function (result) {
        if (result == "true") {
            // CODE TO RUN IF ERROR DOESN'T EXIST
        } else {
            // CODE TO RUN IF ERROR DOES EXIST
            // CREATE THE ERROR MESSAGE AND DISPLAYS IT
            event.preventDefault();
        }
    });
});
4

6 に答える 6

1

フォームの送信とぼかしの検証を行います。

function checkUsername(username) {
    var username = $(".check").val();
    return $.ajax({
        url: "validateUser.php",
        type: "post",
        data: "username=" + username
    }).then(function (result) {
        var def = $.Deferred();
        if (result == "true") {
            // CODE TO RUN IF ERROR DOESN'T EXIST

            def.resolve();
        } else {
            // CODE TO RUN IF ERROR DOES EXIST
            // CREATE THE ERROR MESSAGE AND DISPLAYS IT

            def.reject();
        }
        return def.promise();
    });
}

$(".check").blur(checkUsername);
$("#myform").submit(function(e){
    var self = this;
    e.preventDefault();
    checkUsername().done(function(){
        // username was ok
        self.submit();
    });
});
于 2013-04-18T18:41:13.030 に答える
0

あなたのコメントによると、これを試してみるべきだと思います：

if (result == "true") {
    $(this).closest('form').submit();
} else {
    $(this).closest('form').submit(function(event){
        event.preventDefault();
    });
}
于 2013-04-18T18:54:47.643 に答える
0

return false の代わりに使用しe.preventDefault()ます。

于 2013-04-18T18:37:17.530 に答える
0

フォームの送信を防ぐには、フォームの送信JavaScript イベントのハンドラーのインスタンスpreventDefault()を呼び出す必要があります。event

于 2013-04-18T18:36:11.623 に答える
0

あなたはこれを行うことができます：

$("form").submit(function(){
    return !$(this).hasClass("error");
});

$(".check").blur(function () {
   var username = $(".check").val();
    $.ajax({
        url: "validateUser.php",
        type: "post",
        data: "username=" + username
    }).done(function (result) {
        if (result == "true") {
            $("form").removeClass('error')
        } else {
            $("form).addClass("error");
        }
    });
});

したがって、ajax はクラス エラーを追加するか、有効な場合は削除します。フォームが送信された場合、クラス エラーがある場合はキャンセルされます。

Ajax は非同期であるため、直接返すことはできません。コードは引き続き実行され、done関数を待機しないためです。

于 2013-04-18T18:36:29.043 に答える
0

これを試して：

$(".check").blur(function (event) {

    // Prevent Default the event here...
    event.preventDefault(); 

    var username = $(".check").val();
    $.ajax({
        url: "validateUser.php",
        type: "post",
        data: "username=" + username
    }).done(function (result) {
        if (result == "true") {
            // CODE TO RUN IF ERROR DOESN'T EXIST
            $("form").submit();  
        } else {
            // CODE TO RUN IF ERROR DOES EXIST
            // CREATE THE ERROR MESSAGE AND DISPLAYS IT                             
            $(this).focus();
            alert('An error occurred!');
        }
    });
});

ここでいくつかのポイント：

  1. 関数に を追加することさえせず、eventを呼び出していevent.preventDefault()ました。
  2. 結果が の場合は"true"、フォームを送信するか、コードを実行するだけです。
  3. それ以外の場合はfocus、テキスト ボックスに戻り、警告メッセージを表示します。
于 2013-04-18T18:40:03.000 に答える