Question

您正在使用AJAX将用户名和密码传递到php页面，一旦确定用户名和密码存在，我想加载页面main.html。

在我提交表单的那一刻，我得到了回复的回复，这显示在错误消息标签位置的表单上方，但它没有加载main.html页面。

我是新手，因此不确定我哪里出错了，我已经在chrome web开发者控制台中运行了代码，但它没有显示任何问题，并希望有人能指出我正确的方向。

HTML代码

 <label id="errorMessage"></label>
 <form  name="login" class="login">
   <input name="username" type="text" placeholder="Username"/>
   <input name="password" type="text" placeholder="Password"/>
   <input type="submit" name="login" class="login" value="Login" id="orange"/>
 </form>

AJAX代码

$(document).ready(function(){
  $('form.login').submit(function () {
    var username = $("[name='username']").val();
    var password = $("[name='password']").val()
    // ...
    $.ajax({
  type: "POST",
  url: "login.php",
  data: "username="+ username +"& password="+ password,
  success: function(response){
    if(response == 'true') {
          window.location.href='main.html';
        }
        else {
          $("#errorMessage").html(response);
        }   
      }
    });
return false;
  });
});

PHP代码

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

           if(!empty($username) && !empty($password))
            {
           $result = mysql_query("SELECT * FROM users WHERE username='$username' and  password ='5d503cf3064551d1bae24d5e2aaedbd9'");
           $num_rows01 = mysql_num_rows($result);
            if($num_rows01 === 1)
            {
              echo 'true';
            }
              else
            {
              echo 'false';
            }
          }

Answer 1

如果只是正确调试JS，这是一个简单易解决的问题。让我教你一个简单的技巧。在你的JS中插入所有重要位置的断点。代码在每个断点处停止，然后您可以看到状态。在这种情况下，我们必须确定代码是否进入成功方案。我们插入一个如下的断点：

    success: function(response){
 debugger;
             if(response == 'true')
                    {
                         window.location.href='main.html';
                    }
                    else
                    {
                        $("#errorMessage").html(response);
                    }   
            }

如果代码进入成功场景，它应该点击调试器。然后，您可以查看每个变量的状态并立即找到问题。 这个小技术可以帮助你从长远来看，相信我！

希望这能解决你的问题。

Answer 2

我会使用jQuery＆＃39;而不是返回false

e.preventDefault();

Answer 3

从

改变PHP

echo 'true';

到

echo json_encode(array('response'=>'true'));

从

更改Javascript

function(response){
  if(response == 'true')
  {
    window.location.href='main.html';
  }

到

function(data){
  if(data.response == 'true')
  {
    window.location.href='main.html';
  }
  else
  {
    $("#errorMessage").html(data.response);
  }

将数据类型：'json'添加到ajax调用

$.ajax({
  type: "POST",
  url: "login.php",
  datatype: "json",
  data: "username="+ username +"& password="+ password,

更改数据：“username =”+ username +“＆amp; password =”+ password，to

data: {'username':username,'password':password},

Answer 4

尝试

location.reload();

而不是

 window.location.href='main.html';

PHP＆amp; AJAX获取响应但未加载新页面

4 个答案: