1. ホーム
  2. jquery

[解決済み] jqueryでJsonデータを$.eachでループさせる

2022-04-25 02:01:24

質問

dataという変数に以下のようなJSONが返されています。

これが返されるjsonです...

[ 
{"Id": 10004, "PageName": "club"}, 
{"Id": 10040, "PageName": "qaz"}, 
{"Id": 10059, "PageName": "jjjjjjj"}
]

で、$.eachを使ってコレクションをループさせようとしているのですが、アラートが未定義と表示される問題に遭遇しています。様々な構文を試しましたが、解決できません。

私が使用しているJQueryは

$.each(data, function(i, item) {
    alert(item.PageName);
});

どなたか正しい方向を教えてください。

EDIT これは、私がデータを取得するために使用しているコードです。

$.getJSON('/Cms/GetPages/123', null, function(data) {
  fillSelect(data);
});

そして、これはコールバック時に呼び出される関数です。

function fillSelect(data) {
  alert(data);
  $.each(data, function(i, item) {
    alert(item.PageName);
  });
}

EDIT 2 ドキュメントによると、私が持っているように動作するはずなのですが、そうなっていないのです。fiddlerによると、ヘッダーは以下のように表示されます。

Content-Type: application/json; charset=utf-8

で、JSONは上記の通りです。私はクロームを使用していますが、何か違いがありますか?IEとFFでテストしてみます...。

編集3

を使用して、$.get を生成します。

"[\r\n {\r\n \"Id\": 10041,\r\n \"PageName\": \"01234567890\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n },\r\n {\r\n \"Id\": 10001,\r\n \"PageName\": \"about\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 1\r\n },\r\n {\r\n \"Id\": 10056,\r\n \"PageName\": \"fdgdfgdfg\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 1\r\n },\r\n {\r\n \"Id\": 10052,\r\n \"PageName\": \"hjkhjk\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n },\r\n {\r\n \"Id\": 10059,\r\n \"PageName\": \"jjjjjjj\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 1\r\n },\r\n {\r\n \"Id\": 10057,\r\n \"PageName\": \"qqqqq\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n },\r\n {\r\n \"Id\": 10054,\r\n \"PageName\": \"qwqw\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n }\r\n]"

解決方法は?

var data = [ 
 {"Id": 10004, "PageName": "club"}, 
 {"Id": 10040, "PageName": "qaz"}, 
 {"Id": 10059, "PageName": "jjjjjjj"}
];

$.each(data, function(i, item) {
    alert(data[i].PageName);
});

$.each(data, function(i, item) {
    alert(item.PageName);
});

のようなものでない限り、この2つのオプションはうまく機能します。

var data.result = [ 
 {"Id": 10004, "PageName": "club"}, 
 {"Id": 10040, "PageName": "qaz"}, 
 {"Id": 10059, "PageName": "jjjjjjj"}
];

$.each(data.result, function(i, item) {
    alert(data.result[i].PageName);
});

EDITです。

これで試してみて、どのような結果になったかを説明します。

$.get('/Cms/GetPages/123', function(data) {
  alert(data);
});

FOR EDIT 3:

これは問題を修正しますが、 "eval" を使用するアイデアではなく、 '/Cms/GetPages/123' でどのように応答しているかを確認する必要があります。

$.get('/Cms/GetPages/123', function(data) {
  $.each(eval(data.replace(/[\r\n]/, "")), function(i, item) {
   alert(item.PageName);
  });
});