Question

我正在尝试显示对象的键和值，但我只得到一个错误说：

0[object Object]1[object Object]2[object Object]3[object Object]

我做错了什么？

根据console.log，我的目标是：

(4) [{…}, {…}, {…}, {…}]
0
:
{text: "Now", time: "Now"}
1
:
{text: "09:00", time: "09:00"}
2
:
{text: "09:30", time: "09:30"}
3
:
{text: "10:00", time: "10:00"}
length
:
4
__proto__
:
Array(0)

我试图用以下方式显示它：

var html='';
$.each( data.times, function( key, val ) { 
      html+=key+val;
});
createElement("times", html );

Answer 1

你的问题是因为data.times是一个对象数组，你试图循环它，好像它是一个字符串数组。

要解决此问题，您需要循环遍历数组中对象的属性，您可以使用Object.keys来实现，如下所示：

＆＃13;

var data = {
  times: [{
    "09:00": "09:00",
    "09:30": "09:30",
    "10:00": "10:00"
  }]
}

var html = '';
Object.keys(data.times[0]).forEach(function(key) {
  html += key + '-' + data.times[0][key] + ' ';
});
console.log(html);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

请注意，这只会循环遍历数组中的第一个对象，因为所有数据结构都包含该对象。如果你想循环遍历更多的对象，你需要在这个逻辑上添加另一个循环。

发布问题编辑更新：

现在您已经修改了数据结构，您可以循环遍历数组中的对象并直接访问它们的键：

＆＃13;

var data = {
  times: [
    { text: "Now", time: "Now" },
    { text: "09:00", time: "09:00" },
    { text: "09:30", time: "09:30" },
    { text: "10:00", time: "10:00" }
  ]
}

var html = '';
data.times.forEach(function(obj) {
  html += obj.text + '-' + obj.time + ' ';
});
console.log(html);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

Answer 2

更新了代码。

$.each( data, function( key, val ) { 
      html+=key+val.time;
});
createElement("times", html );

使用jQuery显示对象的键和值

2 个答案: