javascript - 从 jQuery AJAX 调用返回信息并在成功时执行其他 jQuery

Question

我有以下 jQuery AJAX 来复制背景图像。我对如何有效地将信息返回到原始页面感到困惑。这是我通过点击“'#dupBtn”发送的 AJAX...

//DUPLICATE BACKGROUND      
$('#dupBtn').click(function() {
    jQuery.ajax({
            type: "POST",
            dataType:'json',
            url: "../system/bgUpdate.php",
            data: {
                "user":<?= $_POST['user'] ?>,
                "bgID":bgID,
                "refID2":<?= $_POST['refID2'] ?>,
                "refTable":"<?= $_POST['refTable'] ?>",
                "bgTitle":($('#bgTitle').val()),
                "path":path,
                "bgColor":bgColor,
                "bgPoz":bgPoz,
                "bgRepeat":bgRepeat,
                "attach":attach
                }
        });
});

这是 PHP 页面 bgUpdate.php 上的基本 MySQL 查询。

mysql_query("INSERT INTO backgrounds (user,title,path,bgColor,bgPosition,bgRepeat,bgAttachment) VALUES ('".$_POST['user']."','$title','".$_POST['path']."','$bgColor','".$_POST['bgPoz']."','$rt','$attach')");

$bgIDnew = mysql_insert_id();

我想要做的是在成功执行 MySQL 条目后在原始页面上触发以下代码，从 MySQL PHP 页面动态捕获“$bgIDnew”。

$('#bgPickerBox').load('../dialog/bgPickerAlbums.php?album=<?=$bgIDnew?>');

Answer 1

您可以使用 .ajax() 函数的 success 属性来完成此操作:

$('#dupBtn').click(function() {
    jQuery.ajax({
        type: "POST",
        dataType:'json',
        url: "../system/bgUpdate.php",
        data: {
            ...
            },
        success:
            function(response)
            {
                $('#bgPickerBox').load('../dialog/bgPickerAlbums.php?album=<?=$bgIDnew?>');
            }
    });
});

这只是其中的一部分...另一半是您的 PHP 需要返回 jQuery 可以理解为“成功”调用的内容。我的偏好是使用 HTTP 状态代码。在您的情况下，如果成功，您的 PHP 脚本应该返回 200 代码；否则，它应该返回 400 范围内的内容。 (顺便说一句，如果您希望 jQuery 执行一些与错误分开的操作，您可以使用 .ajax() 的 error 属性。)

但是，如果您需要将数据从服务器返回到客户端脚本，那么您的 PHP 可以打印出如下信息:

mysql_query("INSERT INTO backgrounds (user,title,path,bgColor,bgPosition,bgRepeat,bgAttachment) VALUES ('".$_POST['user']."','$title','".$_POST['path']."','$bgColor','".$_POST['bgPoz']."','$rt','$attach')");

$bgIDnew = mysql_insert_id();
// Best practice to keep it in some sort of understandable format
// Here, we'll put it in an associative array:
$response = array('id' => $bgIDnew);
print_r(json_encode($response));

此 PHP 脚本将 $response 变量的 JSON 表示形式发送回 ajax() 方法。您已经配置了 ajax() 方法以将响应数据类型读取为 JSON，因此它已经知道如何读取 response 参数...这意味着您的 success 函数可能如下所示:

success:
    function(response)
    {
        $('#bgPickerBox').load('../dialog/bgPickerAlbums.php?album=' + response.id);
    }