0

AJAX ログイン管理コードの何が問題になっていますか? ユーザー名とパスワードを使用してログインしようとすると、PHP と完全に一致しますが、AJAX コードはまったく機能しません。何が問題ですか?

(注:私はjQueryとAJAxが初めてです)

index.php には次のコードがあります。

<html>
    <head><title>Login form</title></head>
    <body>

        <form id="myForm" action="testlogin.php" method="post">
        username: <input type="text" name="username"> <br />
        password: <input type="password" name="password"> <br />
        <button id="submit">Login</button>
        </form>
        <div id="ack"></div>
    <script type="text/javascript" src="jquery-2.0.2.js" ></script>
    <script type="text/javascript" src="testajax.js"></script>

    </body>


</html>

そして、testlogin.php には次のコードがあります。

<?php require_once("includes/connection.php"); ?> // starting the session.

<?php

$username = mysql_real_escape_string( $_POST["username"]);
$password = mysql_real_escape_string( ($_POST["password"]));

$sql = "SELECT * FROM users2 WHERE (username='$username' AND password='$password')";
$res = mysql_query($sql);
$row = mysql_fetch_array($res);

if($res === FALSE) {
    die(mysql_error()); // TODO: better error handling
}    

if( $row[0] > 0)
echo "Login Successful";
else
    echo "Failed To Login";
?>

<?php include("includes/footer.php"); ?> //closing the session

最後に、このtestajax.jsコードがあります:

$ ("button#submit") .click(function() {
   if ( $( "#username") .val() == "" || $( "#password") .val() == "" ) 
    $("div#ack") .html("Please enter both username and password");
    else
$.post ($("#myForm") .attr("action"),
$ ("#myForm :input") .serializeArryay(),
function(data) {
    $("div#ack") .html(data);

});    

   $("#myForm") .submit(function) {
       return false;
   }
});
4

1 に答える 1

0

これを使用してみてください:

$("#myForm").submit(function(e){
    e.preventDefault();
    if ($('input[name="username"]').val() == "" || $('input[name="password"]').val() == "") 
        $("#ack").html("Please enter both username and password");
    else
        $.post($(this).attr("action"), $(this).serialize())
              .done(function(data) { $("#ack").html(data); })
              .fail(function(jqXHR, textStatus) {
                  alert( "Request failed: " + textStatus );
              });
});

スペースを修正し(コピーして貼り付けたときに発生した可能性があります)、コードを少し減らしました。

フォームを送信すると、フォームは成功して実行されるか、.done(...)失敗して実行されます.fail(...)。これは、スクリプトが失敗している場所を正確に特定するのに役立ちます。

于 2013-06-08T14:44:04.080 に答える