2

次のコードを使用して、ログインとパスワードの有効性を確認します。

$(function (){
$('#submit').click(function(){
        var login=$('#login').val();
        var pwd=$('#pwd').val();
        if(login=='' && pwd ==''){
            $('#div').show().html("Please enter your login and password").delay(2000).fadeOut();
            return false;
        };
        if(login !='' && pwd !=''){
        var dataall={'login':login,'pwd':pwd};
        $.ajax({                                      
            url: "test.php",
            type:"POST",
            data: dataall,                                                      
            dataType: "json",                    
            success: function(data)        
            {
                var login = data[0]; 
                var password = data[1];                 
                if (login==0 || password ==0){
                 return false;
                 $('#login').val('');
                 $('#pwd').val('');
                 $('#div').show().html("The login or password is incorrect. Please try again.").delay(2000).fadeOut();
                }
            } 
        });

        }
}); 
});

ajax 呼び出しはうまく機能しますが、ログインまたはパスワードが間違っている場合に問題があります: フォームは常に送信されます! return false; 助けてくれてありがとう

4

1 に答える 1

0

フォーム データの検証に ajax を使用しているため、実際にフォームを送信する必要はありません。

success: function(data)        
{
  var login = data[0]; 
  var password = data[1];                 
  if (login==0 || password==0){
    $('#login').val('');
    $('#pwd').val('');
    $('#div').show().html("The login or password is incorrect. Please try again.").delay(2000).fadeOut();
   return;
  }
  // when you have reached this line then the user entered correct user/pass
  // if you really like the form to be submitted you could do something like this:
  $('#submit').parents('form').submit();
}

コメントで言ったように、フォームが送信されないようにするには、return falseステートメントを$('#submit').click()ハンドラーの一番下に移動する必要があります。

これが実用的な解決策です：

$('#submit-button').click(function(){
    var login=$('#login').val();
    var pwd=$('#pwd').val();
    if(login=='' && pwd ==''){
        $('#div').show().html("Please enter your login and password").delay(2000).fadeOut();
        return false;
    };
    var dataall={'login':login,'pwd':pwd};
    $.ajax({                                      
        url: "form.php",
        type:"POST",
        data: dataall,                                                      
        dataType: "json",                    
        success: function(data)        
        {
            var login = data[0]; 
            var password = data[1];                 
            if (login==0 || password ==0){ 
             $('#login').val('');
             $('#pwd').val('');
             $('#div').show().html("The login or password is incorrect. Please try again.").delay(2000).fadeOut();
             return false;
            }
            $('#form').submit();
        } 
    });
    return false;
  }); 
});

上記のコードはform、実際のタグに の id を追加すると機能します。呼び出しを機能させるformには、最新の jQuery ライブラリを使用する必要があると思います。また、コールバックでandをandにsubmit()変更したことに注意してください。送信ボタンの を 以外のものに変更する必要があることに注意してください。pwlogpasswordloginsuccessidsubmit

于 2013-10-31T12:42:36.527 に答える