JSON 数据对象不会追加 - json data object won't append

json data object won't append

本文关键字：追加对象数据 JSON | 更新日期: 2023-09-27

我是新手，所以放轻松：

我不知道为什么这个 $.ajax 函数不会将我的 xhr 数据附加到正确的位置。

    // gets the cache data from our php file
function getcaches() {
    $.ajax({
        method: 'get',
        url: "php/findcache.php",
        dataType: "json", // return type data is json
        success: function(data){ // <-- data is in json format
            //parse the json data
            $('#caches').append($('<p>' + data[0].name + '</p>'));
        },
        error: function(data) {
            console.log('error');
        }
    });
    return false;   
}

这就是相关的JavaScript。我知道数据被正确存储在对象中，因为我可以在火虫中看到它......

[OU0397] => stdClass Object
    (
        [code] => OU0397
        [name] => A Mighty Oak in the Open
        [location] => 28.527633|-81.125167
        [type] => Virtual
        [status] => Available
    )

我

只是不明白我做错了什么。有什么指示吗？

代码示例存在 XSS 漏洞（如果名称中包含"<"字符怎么办？

不要在没有正确 HTML 编码的情况下向 HTML 添加文本值。您可以使用 jQuery 的 text（）方法来设置元素文本，而不是连接字符串。

$('#caches').append($('<p/>').text(data[0].name));

这可能是输出不正确的原因之一。

你可以通过执行$（'#caches'）从Firebug或Chrome开发者工具调试jQuery CSS选择器，它将返回一个匹配元素的数组。

如果你有Firebug，你可以在这里设置一个断点：

$('#caches').append($('<p>' + data[0].name + '</p>'));

然后你检查data.调试数据显示OU0397为键;由于PHP的json_encode，这意味着你可能会得到一个字典。字典以不同的方式遍历（例如 for i in data { ... } ）。

你也可以考虑将PHP更改为只返回第一个结果;这简化了JavaScript并减少了网络开销（例如使用json_encode(current($data))）。