Uncaught SyntaxError: Unexpected token {答案

【问题标题】：Uncaught SyntaxError: Unexpected token {Uncaught SyntaxError: Unexpected token {
【发布时间】：2014-01-06 07:58:56
【问题描述】：

从 Chrome 开发者控制台执行 console.log($obj.longurl) 时提示错误

Uncaught SyntaxError: Unexpected token { 
$.ajax.complete 
L jquery.min.js:19
N

以下是我从 HTML 页面执行并提交表单以调用外部 PHP 文件的脚本。

Javascript 是从 http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js

调用的

$('#shortener').submit(function(e) {
    e.preventDefault();
    $('#status').text('');
    $.ajax({
        cache: false,
        type: "POST",
        dataType: "json",
        data: $('#shortener').serialize(),
        url: $('#shortener').attr('action'),
        complete: function (XMLHttpRequest, textStatus) {
            console.log(XMLHttpRequest);
            $obj = JSON.parse(XMLHttpRequest.response);
            if ($obj.loginResult == "Passed") {
                ($('#longurl').val() === "") ? console.log("Empty longurl") : console.log($obj.longurl);
            } else {
                $('#status').text("Login Failed");
            };
        }
    });
    return false;
});

PHP

echo json_encode(array('loginResult' =>'Passed'));
echo json_encode(array('longurl' => BASE_HREF . $shortened_url));

typeof $obj.longurl是字符串但是不知道为什么可以返回到$('#shortener').val()，有没有类似的经验和解决方法？

【问题讨论】：

顺便说一句，下次尽量缩进你的代码，这样有点难读，尤其是当主要问题是块语法时，这将更容易解决如果代码正确缩进。
您是否检查过您的响应是有效的 JSON 格式？
合并2个数组并放一个echo json_encode

标签： javascript php ajax

【解决方案1】：

您的 PHP 代码正在生成无效的 JSON。您基本上是在相互呼应两个 JSON 编码对象，这总体上会导致 JSON 无效。它看起来像：

{"loginResult": "Passed"} {"longurl": "<some URL>"}

第二个{是语法错误。

它应该是一个对象数组（虽然那会是一个奇怪的结构）

[{"loginResult": "Passed"}, {"longurl": "<some URL>"}]

或一个对象

{"loginResult": "Passed", "longurl": "<some URL>"}

创建和编码一个数组：

echo json_encode(array(
    'loginResult' => 'Passed',
    'longurl' => BASE_HREF . $shortened_url
));

另一个问题可能是，至少正式地，传递给完整回调的jqXHR object 没有.response 属性。由于您还已经设置了dataType: 'json' 选项，因此您无需显式解析响应。

这是您的代码的改进版本：

$.ajax({
    cache: false,
    type: "POST",
    dataType: "json",
    data: $('#shortener').serialize(),
    url: $('#shortener').attr('action'),
}).done(function (data) {
    if (data.loginResult == "Passed") {
        ($('#longurl').val() === "") ? console.log("Empty longurl") : console.log(data.longurl);
    } else {
        $('#status').text("Login Failed");
    }
});

【讨论】：

我终于创建了一个数组变量并将键/值推送到数组并回显数组变量，例如 echo json_encode($arr);
.response 是我执行 console.log(jqXHR) 时 jqXHR 的属性之一。如果没有 JSON.parse() 应用，我无法获取对象值。 api.jquery.com/jQuery.ajax/#jqXHR
您可以选择任何适合您的方式。我刚刚提到它是因为.response 没有在文档中列为属性（至少我没有看到它）。如果您使用成功事件处理程序（这是.done 所做的）而不是完整的事件处理程序，那么您可以访问已经解析的数据（因为这就是dataType: 'json'，它将解析的数据传递给成功事件处理程序)。
感谢 Felix Kling 的评论。