web-dev-qa-db-ja.com

jQueryでJSON配列を解析する方法は？

[〜＃〜] edit [〜＃〜] jQueryのドキュメントを確認し、jsonデータ型を指定して$ .ajaxを使用すると、評価されたjavascriptオブジェクトが返されるため、ここではeval（）は答えではありません。とにかく、配列ではなく単一のJSONオブジェクトを解析できるので、それを知っていました。問題は$ .each-がそれらを通り抜けることです:)

JQueryのJSON配列を文字に解析するための構文に従いましたが、何らかの理由で機能しません。 $ .ajaxを使用して配列をフェッチし、正しいデータ型を指定しました。Firebugでは、PHPスクリプトからの応答が[]であることがわかります。それでも、$。eachを使用しようとすると配列を反復処理するために、配列のさまざまな部分をconsole.logにしようとすると、未定義の値しか取得されません。ここで、phpスクリプトが配列を作成してエンコードします。

if(mysqli_num_rows($new_res) > 0) {
$messages = array();

while($message_data = mysqli_fetch_assoc($query_res)) {
  $message = array(
    'poster' => $message_data['poster'],
    'message' => $message_data['message'],
    'time' => $message_data['time']
  );

  $messages[] = $message;
}

echo json_encode($messages);
} else if(mysqli_num_rows($new_res) == 0) {
$message = array(
  'poster' => '',
  'message' => 'No messages!',
  'time' => 1
);

echo json_encode($message);
}

そして、これがそれを解析する私の試みです：

   var logged_in = '<?php echo $logged_in; ?>';
   var poster = '<?php echo $_SESSION["poster"];?>';
     $.ajax({
     url: 'do_chat.php5',
     type: 'post',
     data: ({'poster':poster,'logged_in':logged_in}),
     dataType: 'json',
     success: function(data) {
         $.each(data, function(messageIndex, message) {
                    console.log(parseInt($('#chatWindow :last-child > span').html())+' '+message['time']);
       if((parseInt(message['time']) > parseInt($('#chatWindow :last-child > span').html()))) {
     $('#chatWindow').append('<div class="poster">'+message['poster']+'</div><div class="message"><span>'+message['time']+'</span>'+message['message']+'</div>');
       }
       });
     }
     });

$ .each関数がないと、単一のJSONオブジェクトを正常に解析できますが、配列は解析できません。これはJSONと$ .eachを使った初めての外出であり、jQueryはかなり新しいので、コードに醜いビットが含まれている場合は簡単に行ってください。

jqueryarraysjsoneach
5
user97410

いいえ、evalは安全ではないため、はるかに安全なJSONパーサーを使用できます。var myObject = JSON.parse(data);このためにlib https://github.com/douglascrockford/JSON -js

13
Cesar

私はこれがあなたの投稿からかなり長いことを知っていますが、この問題を経験しているかもしれない他の人のために投稿して、私がしたようにこの投稿に出くわしたいと思いました。

Jqueryの$.eachには、配列内の要素の性質を変更する何かがあるようです。

私は次のことをしたかった：

$.getJSON('/ajax/get_messages.php', function(data) {

    /* data: 

    [{"title":"Failure","details":"Unsuccessful. Please try again.","type":"error"},
    {"title":"Information Message","details":"A basic informational message - Please be aware","type":"info"}]

    */

    console.log ("Data0Title: " + data[0].title);
    // prints "Data0Title: Failure"

    console.log ("Data0Type: " + data[0].type);
    // prints "Data0Type: error"

    console.log ("Data0Details: " + data[0].details);
    // prints "Data0Details: Unsuccessful. Please try again"


    /* Loop through data array and print messages to console */

});

ループを実行するために、最初にjquery $.eachを使用してデータ配列をループしようとしました。ただし、OPが指摘しているように、これは正しく機能しません。

$.each(data, function(nextMsg) {    
    console.log (nextMsg.title + " (" + nextMsg.type + "): " + nextMsg.details);
    // prints 
    // "undefined (undefined): undefined
    // "undefined (undefined): undefined
});

データ配列でテンキーを使用するとdata[0]要素にアクセスできるため、これは正確には意味がありませんでした。したがって、数値インデックスの使用が機能したので、$.eachブロックをforループに（正常に）置き換えようとしました。

var i=0;
for (i=0;i<data.length;i++){
    console.log (data[i].title + " (" + data[i].type + "): " + data[i].details);
    // prints
    // "Failure (error): Unsuccessful. Please try again"
    // "Information Message (info): A basic informational message - Please be aware"
}

したがって、根本的な問題はわかりません。基本的な昔ながらのjavascript forループは、jqueryの$.eachの機能的な代替手段のようです。

5
Tocano

jQuery.parseJSON --jQuery1.4.1の新機能

4
user42507

.NET 3.5の使用[〜＃〜] fix [〜＃〜]

皆さんは少し間違っていますが、皆さんの努力の組み合わせは報われました！

Eval（ '（[' + jsonData + ']）'）;の代わりに行う

success: function(msg){
var data = eval(msg.d);
var i=0;
for(i=0;i<data.length;i++){
    data[i].parametername /// do whatever you want here.
};

「evalを使用しない」全体については何も知りませんが、「（['+ msg +']）」を実行することで、これらのオブジェクトをレベルを上げるのではなく、より深くネストしていることがわかります。 。

2
andrew.helgeland

Ajax呼び出しから返されたJSONデータを解析しようとしていますが、次のように機能しています。

サンプルPHPコード

$portfolio_array= Array('desc'=>'This is test description1','item1'=>'1.jpg','item2'=>'2.jpg');

echo json_encode($portfolio_array);

そして、.jsでは、私は次のように解析しています：

var req=$.post("json.php", { id: "" + id + ""},
function(data) {
    data=$.parseJSON(data);
    alert(data.desc);
    $.each(data, function(i,item){
    alert(item);
    });
})
.success(function(){})
.error(function(){alert('There was problem loading portfolio details.');})
.complete(function(){});

以下のような多次元配列がある場合

$portfolio_array= Array('desc'=>'This is test description 1','items'=> array('item1'=>'1.jpg','item2'=>'2.jpg'));
echo json_encode($portfolio_array);

次に、以下のコードが機能するはずです。

var req=$.post("json.php", { id: "" + id + 
    function(data) {
    data=$.parseJSON(data);
    alert(data.desc);
    $.each(data.items, function(i,item){
    alert(item);
    });
})
.success(function(){})
.error(function(){alert('There was problem loading portfolio details.');})
.complete(function(){});

ここでのサブ配列キーはアイテムであることに注意してください。xyzがある場合は、data.itemsの代わりにdata.xyzを使用するとします。

2
Rammi Gill

評価に注意して、JSON仕様 http://json.org/js.html 次のようなものをお勧めします

var myObject = eval('(' + myJSONtext + ')');

そして、もう少し落とし穴があるかもしれません。それを処理するjQueryのプラグインがあります、私は推測します：

http://code.google.com/p/jquery-json/

1
Victor

dataはその時点での'[{}]'の文字列であり、次のようにevalできます。

function(data) {
    data = eval( '(' + data + ')' )
}

ただし、この方法は安全とは言えません。これは少し手間がかかりますが、ベストプラクティスは、CrockfordのJSONパーサーで解析することです。 https://github.com/douglascrockford/JSON-js

別のメソッドは$.getJSONであり、純粋なjQuery依存メソッドの場合はdataTypeをjsonに設定する必要があります。

0
meder omuraliev

Javascript eval（）関数を使用して、JSONを解析できます。より良い説明については JSON Webサイト を参照してください。ただし、成功関数を...に変更できるはずです。

var returnedObjects = eval(data);
var i = 0;
for (i = 0; i < returnedObjects.length; i++){
    console.log('Time: ' + returnedObjects[i].time);
}

...または何か近いもの。

0
BenN

JSONパーサーは JSON.org Webサイトのリンク からダウンロードできます。これはうまく機能します。また、JSONを文字列化してコンテンツを表示することもできます。

また、EVALを使用していて、それがJSON配列である場合は、次のsynraxを使用する必要があります。

eval('([' + jsonData + '])');

0
Fermin