jquery .ajax 总是返回错误 - 数据被添加到数据库答案

【问题标题】：jquery .ajax always returns error - data being added to databasejquery .ajax 总是返回错误 - 数据被添加到数据库
【发布时间】：2013-09-18 00:38:20
【问题描述】：

我正在尝试使用 jquery ajax 调用将用户添加到数据库。用户可以很好地添加到数据库中，但 ajax 总是返回错误。我也不确定如何检索特定错误。下面是我的代码、表单、php 和 jquery。

这里是jquery

$(document).ready(function() {

    //ajax call for all forms. 
    $('.button').click(function() {
        var form = $(this).closest('form');
        $.ajax({
            type: "POST",
            url: form.attr('data'),
            dataType: 'json',
            data: form.serialize(),
            success: function (response) {
                alert('something');
            },
            error: function() {
                alert('fail');
            }
        });
    });
  });

这里是 PHP

<?php
include 'class_lib.php';

if(isset($_POST['username'])) {
    $user = new Users;
    $user->cleanInput($_POST['username'], $_POST['password']);
    if($user->insertUser()) {
        echo json_encode('true');
    } else {
        echo json_encode('false');
    }
}

这里是 HTML

<div id='newUser' class='tool'>
    <h3>New User</h3>
    <form method='post' name='newUser' data='../php/newUser.php'>
        <span>Username</span><input type='text' name='username'><br>
        <span>Password</span><input type='password' name='password'>
        <input type='submit' name='submit' class='button' style='visibility: hidden'>
    </form>
    <span class='result'> </span>
</div>

【问题讨论】：

我的猜测是它的解析错误，尝试删除 dataType: 'json', 看看它是否有效。
似乎它仍然在失败中运行该功能

标签： javascript php jquery html ajax

【解决方案1】：

@Musa，上面你提到了

我的猜测是它的解析错误，尝试删除 dataType: 'json'，看看它是否有效

您绝对解决了我遇到的问题！我的 ajax 发布请求与上面类似，它只是不断返回到“错误”部分。虽然我用firebug检查过，但状态是200(ok)，没有错误。

删除 'dataType:json' 为我解决了这个问题。非常感谢！

【讨论】：

堆栈溢出再次拯救了这一天。也为我工作！

【解决方案2】：

原来我必须将async: false 添加到 $.ajax 函数中。它没有得到 php.ini 的回复。

【讨论】：

【解决方案3】：

我知道这是一个老问题，但我刚刚遇到了这样一个奇怪的情况 (jquery ajax returns success when directly executed, but returns error when attached to button, even though server response is 200 OK)

发现在form标签内有按钮会导致JQuery总是返回错误。只需将form 标签更改为div 即可解决问题。

我相信 JQuery 假定通信应该是表单编码的，即使你说它是 application/json。

尝试将按钮移到表单之外，看看会发生什么...

【讨论】：

【解决方案4】：

我在那里遇到了同样的问题和发现。问题一直是我的 jQuery 版本，我使用的是 jquery 版本 (jquery-1.10.2.js) 但这个版本不是 Ajax stablish。所以，我更改了 (jquery-1.8.2.js) 的版本，奇迹发生了。

祝你好运！

【讨论】：

【解决方案5】：

您应该为成功响应指定状态代码 200。

<?php
http_response_code(200);
?>

请看这里：http://php.net/manual/en/function.http-response-code.php

【讨论】：

【解决方案6】：

第一种解决方案

尝试像这样在你的js文件中删除dataType：

$(document).ready(function() {
    $('.button').click(function() {
        var form = $(this).closest('form');
        $.ajax({
            type: "POST",
            url: form.attr('data'),
            data: form.serialize(),
            success: function (response) {
                alert('something');
            },
            error: function() {
                alert('fail');
            }
        });
    });
});

第二种方案

像这样向 AJAX 发送一个真正干净的 JSON：

PHP

if(isset($_POST['username'])) {
    $user = new Users;
    $user->cleanInput($_POST['username'], $_POST['password']);
    if($user->insertUser()) {
        $error = [
            "title"=> 'true',
            "body"=> 'some info here ... '
        ];
        echo json_encode($error);
    } else {
        $error = [
            "title"=> 'false',
            "body"=> 'some info here ... '
        ];
        echo json_encode($error);
    }
}

JavaScript

$(document).ready(function() {
    $('.button').click(function() {
        var form = $(this).closest('form');
        $.ajax({
            type: "POST",
            url: form.attr('data'),
            dataType: 'json',
            data: form.serialize(),
            success: function (data) {
                let x = JSON.parse(JSON.stringify(data));
                console.log(x.title);
                console.log(x.body);
            },
            error: function() {
                //code here
            }
        });
    });
});

【讨论】：