0

使用 jQuery 和 AJAX 提交表单时,我在返回的包含IMG标签的 HTML 上收到 403 错误。

这是我用来提交表单的代码:

// Add a new personality to the quiz
    $('form#personality_editor').submit(function(e) {

        e.preventDefault();

            // Submit the form with jQuery Form plugin to handle attachments
            $(this).ajaxSubmit({
                dataType: "json",
                resetForm: true,
                beforeSend: function() {
                    // Show the loading spinner
                    $('img#personality_loader').show();
                },
                success: function(add_personality_response) {

                    // Hide the image loader
                    $('img#personality_loader').hide('fast');

                    if (add_personality_response["success"] == "true") {

                        // Create a new personality in the list of personalities
                        $('div#quiz_personalities').append(add_personality_response["personality_html"]);

                            // Add the personality to list of hidden personalities
                            AddRemovePersonality(add_personality_response["personality_id"], "add");

                            // Set the focus on to personality name
                            $('input#new_personality_name').focus();

                            // Show or hide the no personalities notice
                            ShowHideNoPersonalitiesNotice();

                            alert("Success");
                    }

                },
                error: function() {
                    alert("There was an error adding personality");
                }
            });

    });

这是我从代码中得到的完整 JSON 响应:

    {"success":"true","personality_id":191,"personality_name":"Avril Lavigne","personality_image":"191avril.jpg","personality_html":"<div class=\"personality_wrapper\" data-personality-id=\"191\"><img src=\"images\/personalities\/personality_images\/192avril.jpg\" class=\"personality_image_small\" \/><div class=\"personality_info\"><div class=\"personality_name\" title=\"Kjh\">Kjh<\/div><div class=\"personality_options\"><a href=\"#\" class=\"personality_option personality_edit\">Edit<\/a><a href=\"#\" class=\"personality_option personality_delete\">Delete<\/a><\/div><\/div><\/div>"}

这是personality_html我使用.append()jQuery 的功能添加到 DOM 中的。

此问题出现在 Internet Explorer 中,因为它在 Chrome 中运行。

图像正在上传到我所在位置的服务器images/personalities/personality_images/192avril.jpg

我从页面返回的响应是:

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
<html><head>
<title>403 Forbidden</title>
</head><body>
<h1>Forbidden</h1>
<p>You don't have permission to access /&quot;images//personalities//personality_images//192avril.jpg/&quot;
on this server.</p>
</body></html>

这与从我的页面传递的转义数据有关吗?我在响应json_encode()之前使用它。echo

以下是 IE 开发者工具的视图:

开发者工具 IE

4

1 回答 1

1

您很可能尝试将 JSON 解析为 JavaScript 对象两次。

由于您已经为调用指定了响应数据类型为 JSON,jQuery 会自动为您将响应解析为 JavaScript 对象(如果响应为,.ajaxSubmit()它也会这样做,无论您是否指定)。Content-Typeapplication/jsondataType

这意味着在成功回调中,add_personality_response1已经是一个 JavaScript 对象。然而你正在尝试$.parseJSON第二次:

var add_personality_response = $.parseJSON(add_personality_response1);

我不太确定删除这条线是否会立即解决问题,但这绝对是您必须开始的方式。

于 2012-09-22T18:22:07.160 回答