JSON属性返回undefined
所以我创建一个商店目录作为个人项目。我有两个基本的过滤器(类别和子类别)。当我决定要使用一些JSON时,我只是返回所有内容服务器端。所以我用json_encode(array());发回json数据。JSON属性返回undefined
当我控制台登录时,一切看起来都很好。摘录:
{
"product": [
{
"productID": "1",
"name": "Black Socks",
"description": "Lorem ipsum no facer prompta vim, movet ubique qui ei. Per no regione aliquid, ea mei nulla scribentur liberavisse.",
"price": "6.99",
"stock": "25",
"image": "placeholder.png",
"category_id": "1",
"subcategory_id": "1"
}
}
但是,当我尝试访问的属性,说名,则返回undefined。
function displayAll() {
var category = document.getElementById('category');
var option = category.options[category.selectedIndex].value;
var catalogDiv = document.getElementById('catalog');
var allItems;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function (category) {
if (this.readyState == 4 && this.status == 200) {
catalog = JSON.parse(this.responseText);
catalog = JSON.stringify(catalog, null, 4);
console.log(catalog.name); //<- Returns undefined
catalogDiv.innerHTML = 'Success';
}
}; //End anon function
//request_type, URL, boolean (is asynchronous)
xhttp.open('POST', '../content/no_filter.php', true);
//Correct header content
xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
//Sends post data
xhttp.send('option=' + option);
} //End display all
下面是我的源代码的链接:https://github.com/WordWizard/store-catalog
我从来没有使用字符串化()函数,但我读过的文档和它说,这一个JSON对象转换为一个字符串。你正在尝试访问一个String属性,所以它返回undefined。
试评或删除以下行:
catalog = JSON.stringify(catalog, null, 4);
你想要的是一个JSON对象,而不是字符串)
返回'{Object {product:Array [10]}}'。当我尝试访问目录的属性:'console.log(catalog.name);'或'console.log(catalog [0] .name);'时,它们返回undefined。 –
好的,我发现我需要引用目录中的产品对象。 'console.log(catalog.product [0]);'工作:) –
if (this.readyState == 4 && this.status == 200) {
catalog = JSON.parse(this.responseText);
// catalog = JSON.stringify(catalog, null, 4); // remove these line
console.log(catalog.name); //<- Returns undefined
catalogDiv.innerHTML = 'Success';
}
在你有你的JSON对象转换为字符串的行。所以你不能从这个字符串获取名字。
如果删除此行,将工作正常。
{
"product": [
{
"productID": "1",
"name": "Black Socks",
"description": "Lorem ipsum no facer prompta vim, movet ubique qui ei. Per no regione aliquid, ea mei nulla scribentur liberavisse.",
"price": "6.99",
"stock": "25",
"image": "placeholder.png",
"category_id": "1",
"subcategory_id": "1"
}
] // close your array properly.
}
改变你的代码是这样的:
function displayAll() {
var category = document.getElementById('category');
var option = category.options[category.selectedIndex].value;
var catalogDiv = document.getElementById('catalog');
var allItems;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function (category) {
if (this.readyState == 4 && this.status == 200) {
catalog = JSON.parse(JSON.stringify(catalog,null,4));
console.log(catalog)
console.log(catalog.paroduct[0].name);
catalogDiv.innerHTML = 'Success';
}
}; //End anon function
//request_type, URL, boolean (is asynchronous)
xhttp.open('POST', '../content/no_filter.php', true);
//Correct header content
xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
//Sends post data
xhttp.send('option=' + option);
} //End display all
什么是'JSON.stringify'的目的是什么? –
我想你错过了关闭']'(或者稍后在你的代码中定义,并且被省略),如果你的'product'包含一个对象数组,也不会是'catalog [0] .name' ? –