使用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.会解决你的问题，你需要将事件传递给函数。