Razor Page & jQuery 位置 1 JSON 中的意外标记 o

Question

我有一个如下所示的 JSON 对象，我需要通过 jQuery 属性标记传递一些对象。我收到 JSON 解析错误，但不确定原因。

  "Walkers" : "true",
  "Owners" :[
  {
        "Name":"Bob",
        "Description":"Old",
        "Pets": [
          {"Name" : "Cuddles", "Age": "8"}, 
          {"Name" : "Pounce", "Age": "3"}
        ]
      },
      {
        "Name":"Mary",
        "Description":"Older",
        "Pets": [
          {"Name" : "Red", "Age": "13"}, 
          {"Name" : "Leaf", "Age": "1"}
        ]
      }
      ]

在我的剃刀页面中，我正在序列化我需要的 JSON 对象的部分。

@foreach (var people in myjson) {

<p>@people.Walkers</p> //true

<div id="mytarget" data-owners='@Json.Serialize(people.Owners)'> </div>

}

在jQuery中：

var val = $("#mytarget").data('owners');

            console.log("json " + val); // result: json [object Object],[object Object]

            console.log("parsed " + JSON.parse(val)); // result: VM7:1 Uncaught SyntaxError: Unexpected token o in JSON at position 1 at JSON.parse (<anonymous>)

如果我不使用 JSON.Parse 而只是尝试循环遍历 JQuery 中的对象，我将以“0”和“1”结束

var val = $("#mytarget").data('owners');

for (var obj in val) {
   Console.log(obj);
}

Result '0' and '1'.

Answer 1

那是因为您传递的是对象数组而不是对象 所以在你的控制台中你会得到这样的东西：

[
  {
        "Name":"Bob",
        "Description":"Old",
        "Pets": [
          {"Name" : "Cuddles", "Age": "8"}, 
          {"Name" : "Pounce", "Age": "3"}
        ]
      },
      {
        "Name":"Mary",
        "Description":"Older",
        "Pets": [
          {"Name" : "Red", "Age": "13"}, 
          {"Name" : "Leaf", "Age": "1"}
        ]
      }
]

您不能像对象一样解析数组将 return 出错。

您还可以使用 devtools 来查看数据是如何来的，也许它是以另一种格式来的，这里是文档以获取更多信息https://developers.google.com/web/tools/chrome-devtools/inspect-styles/

错误在 for bucle 中正确的语法是：

var val = $("#mytarget").data('owners');

for (i = 0; i < val.length; i++) {
   console.log(val[i])
}

这是文档：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration

或者你可以使用地图： https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/map

var val = $("#mytarget").data('owners');

val.map(item => {
  console.log(item)
})

Answer 2

I have a JSON object as below and I need to pass some of the object via a jQuery Attribute tag. I am getting a JSON parse error

如果您使用 console.log(val); 将 val 输出到控制台选项卡，您会发现您得到了一个 json 数组，如下所示。

when I try to use obj.Name I get 'undefined'

要从该数组中提取 owner 和 pets 的数据，您可以参考以下代码片段。

var val = $("#mytarget").data('owners');

//console.log("json " + val);

console.log(val);


$.each(val, function (index, owner) {
    //owner object
    console.log("Name: "+owner.name+"; Description: "+owner.description);

    //pets of current owner
    $.each(owner.pets, function (index, pet) {
            console.log("Name: "+pet.name+"; Age: "+pet.age);
    })
})

Razor Page & jQuery 位置 1 JSON 中的意外标记 o

Unexpected token o in JSON at position 1 in Razor Page & jQuery

json

asp.net-core

razor-pages