Ajax/jqueryログインフォームが失敗しました

Question

私はこれを1000回見ました。なぜそれが動作していないのか分かりません。

これは、単純なAjaxのログインフォームです。資格情報が正しい場合でも、falseを返します。

のAjax機能（私はそれに直接投稿することでajax_login.phpテスト）：

$(document).ready(function() { 
$("#submit_login").click(function() { 


var username = $("#username").val(); 
var password = $("#password").val(); 

    $.ajax({ 

     type: "POST", 
     url: "scripts/ajax_login.php", 
     data: "username=" + username + "&password=" + password, 
     success: function(result) { 
      if(result == '0') 
      { 
       $(document.location = 'index.php? page=profile&user=' + username); 
      } 
      else 
      { 
       $("#login_error").show("fast"); 
      } 
     } 
    });   
    return false; 
}); 
}); 

ajax_login.php

session_start(); 
require('../conf/config.php'); 

if($_POST) 
{ 

$u = mysql_real_escape_string($_REQUEST['username']); 
$p = md5(mysql_real_escape_string($_REQUEST['password'])); 

$con = mysql_connect($mysql_server,$mysql_user,$mysql_password); 
$db = mysql_select_db($mysql_db); 

$query = mysql_query("SELECT * FROM users WHERE username = '$u' AND password = '$p'"); 

if(mysql_num_rows($query) > 0) 
{ 
    $sid = session_id(); 
    $query = "UPDATE users SET sid='$sid' WHERE username='$u'"; 
    $result = mysql_query($query); 

    if($result) 
    { 
     $_SESSION['loggedin'] = $u; 
     echo '0'; 
    } 
} 
} 

フォーム：

<div class="login_form"> 
<form action="scripts/ajax_login.php" method="POST"> 
Login<br /><br /> 
Username: <br /> 
<input type="text" name="username" id="username" /> <br /> 
Password: <br /> 
<input type="password" name="password" id="password" /> 
</div> 
<input type="checkbox" name="remember" id="rem" value="checked"/><label for="rem">Stay logged in?</label><br /> 
<?php $formKey->outputKey(); ?> 
    <input type="submit" value="Login!" name="submit" id="submit_login" /> 
    </form> 

Answer 1

常に返すようになるだろうfalseで、$.ajax()（他のjQuery ajaxメソッドと同じように）はデフォルトで非同期で動作します。コールバック内ですべてのイベント処理を行う必要があります（たとえば、successコールバックなど）。

また、私はやっていないことをお勧め：if (result == '0'）。代わりに、===を使用してください。

理想的には、JSON、または真、偽、0,1などではないものを返すのが理想的です。これらの4つの値などは、JavaScriptのブール処理に関しては簡単に混乱する可能性があります。別にreturn文は、あなたのコールバック関数（successとerror）のいずれかが呼び出される前に実行され、何を$("#submit_login")のクリックハンドラ関数の戻り値で行われることを思われないという事実から

Answer 2

AJAX呼び出しが実行されているかどうか、ページは上のリロードを行う - #submit_loginがsubmitタイプのボタンであるため、何が起こってすることができることは、あなたがclickイベントのAJAX呼び出しを行っているものの、ブラウザは、フォームのポストを提出されていますフォーム送信（そうclickハンドラはfalseを返す代わりに、あなたのsuccessハンドラに当たっているかのように見えます）。非提出タイプのボタンにそれを変更します。

<input type="button" value="Login!" name="submit" id="submit_login" /> 

なので、同じように、あなたのハンドラ内でのJavascriptのpreventDefaultを使用するなど、これを行う他の方法、あります：私が前に言ったように

$("#submit_login").click(function(ev) { 
    ev.preventDefault(); 
    //Rest of code... 

は、doesnの戻り値がすべてここで使用されているように見えるので、本当にfalseを返す必要はありません。必要な処理は、success/errorハンドラに置くことができます。

Answer 3

テストしたが、あなたはこれを試してみてくださいなし：

$.ajax({ 
    type: "POST", 
    url: "scripts/ajax_login.php", 
    data: {"username":username, "password":password}, 
    success: function(result) { 
     if(result==='0') 
     { 
      $(document.location = 'index.php?page=profile&user='+username); 
     } 
     else 
     { 
      $("#login_error").show("fast"); 
      return false; 
     } 
    } 
});