使用Jquery Mobile，PHP和MySQL的移動應用程序登錄表格

Question

我是移動開發新手。我正在嘗試開發一個登錄表單，用於檢查MySQL數據庫的用戶名和密碼。我已經建立了一些代碼。我有兩個問題。第一個是，在提交表單後，在瀏覽器的URL欄中，我可以看到輸入的用戶名和密碼，即使在我的JQuery腳本上使用POST。第二個問題是頁面繼續返回到login.html，而不是main.html。下面是我用PHP，JQuery和MySQL的實際經驗構建的。

HTML表單

<div id="loginPage" data-role="page"> 
<div data-role="header"> 
<h1>App Authentication</h1> 
</div> 

<div data-role="content"> 
    <div id="landmark-1" data-landmark-id="1"> 
    <form id="loginForm"> 
    <div data-role="fieldcontain" class="ui-hide-label"> 
     <label for="username">Username:</label> 
     <input type="text" name="username" id="username" value="" placeholder="Username" /> 
    </div> 

    <div data-role="fieldcontain" class="ui-hide-label"> 
     <label for="password">Password:</label> 
     <input type="password" name="password" id="password" value="" placeholder="Password" /> 
    </div> 

    <input type="submit" value="Login" id="submitButton"> 
    </form> 
</div> 
</div> 

<div data-role="footer"> 
    <h4>&copy; Silva's General Services</h4> 
</div> 

的auth.php

<?php 
$mysqli = new mysqli($mysql_hostname,$mysql_user, $mysql_password, $mysql_database); 

header("access-control-allow-origin: *"); 
header("access-control-allow-methods: GET, POST, OPTIONS"); 
header("access-control-allow-credentials: true"); 
header("access-control-allow-headers: Content-Type, *"); 
header("Content-type: application/json"); 

// Parse the log in form if the user has filled it out and pressed "Log In" 
if (isset($_POST["username"]) && isset($_POST["password"])) { 

     CRYPT_BLOWFISH or die ('No Blowfish found.'); 

     //This string tells crypt to use blowfish for 5 rounds. 
     $Blowfish_Pre = '$2a$05$'; 
     $Blowfish_End = '$'; 

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


     $sql = "SELECT id, password, salt, username FROM users WHERE username='$username' LIMIT 1"; 
     $result = $mysqli->query($sql) or die($mysqli->error()); 
     $row = mysqli_fetch_assoc($result); 

     $hashed_pass = crypt($password, $Blowfish_Pre . $row['salt'] . $Blowfish_End); 

     if ($hashed_pass == $row['password']) { 
      $response_array['status'] = 'success'; 
     } else { 
      $response_array['status'] = 'error'; 
     } 
echo json_encode($response_array); 

} 
$mysqli->close(); 
?> 

jQuery腳本

<script> 
$('#loginForm').submit(function(){ 
e.preventDefault(); 
jQuery.support.cors = true; 
$.ajax({ 
    url: 'http://www.test.com/mobile/auth.php', 
    crossDomain: true, 
    type: 'post', 
    data: $("#loginForm").serialize(), 
    success: function(data){ 
     if(data.status == 'success'){ 
      window.location.href = 'http://www.test.com/mobile/main.html'; 
     }else if(data.status == 'error'){ 
      alert("Authentication Invalid. Please try again!"); 
      return false;   
     } 

    } 
}); 

}); 
</script> 

我真的很感激任何幫助。

謝謝。

Answer 1

這個只是一個猜測，但：

1. 你沒有方法在你的窗體聲明：<form action="your_action_url" method="post">。

2. 它看起來像你沒有在函數中傳遞事件。我知道的語法看起來像這樣：$('#loginForm').submit(function(e){通知「E」作爲函數參數

3. jQuery有e.preventDefault和e.stopPropagation這是兩個不同的東西，看到jquery event object。其他一些處理程序可能正在做些事情。您也可以使用「返回false」;而不是兩個，這取決於你的用例。

我覺得2.會解決你的問題，你需要將事件傳遞給函數。