3

ASP.NETページでJQueryを使用してスクリプトを作成しています。次のようなJSON文字列を作成します。

<input id="hfImages" type="hidden" value="[
{"ProductID": "000001",
 "Small": "http://myimages.com/images/I/75.jpg",
 "Medium": "http://myimages.com/images/I/160.jpg",
 "Large": "http://myimages.com/images/I/320.jpg",
 "Thumb": "http://myimages.com/images/I/30.jpg"},

{"ProductID": "000002",
 "Small": "http://myimages.com/images/I/75ab.jpg",
 "Medium": "http://myimages.com/images/I/160j.jpg",
 "Large": "http://myimages.com/images/I/320y.jpg",
 "Thumb": "http://myimages.com/images/I/30ii.jpg"},

{"ProductID": "000003",
 "Small": "http://myimages.com/images/I/75.jpg",
 "Medium": "http://myimages.com/images/I/160.jpg",
 "Large": "http://myimages.com/images/I/320.jpg",
 "Thumb": "http://myimages.com/images/I/30.jpg"}
]"/>

この文字列からオブジェクトを作成します。

var images = $.parseJSON($("#[id*='hfImages']").val());

このJSON文字列から取得する必要がある「ProductID」の値を含むvarを呼び出しProductIDますが、その方法がわかりません。最終的に（この文字列から適切なデータを取得したら）、次のようなことができるようになりたいと思います。

$("#productImages img.small").src(image[0].Small)
$("#productImages img.medium").src(image[0].Medium)
$("#productImages img.large").src(image[0].Large)
$("#productImages img.thumb").src(image[0].Thumb)

目的の「キー」が見つかるまでJSONオブジェクトをループする例を見てきましたが、.filterまたは.map？を使用してこれを行うより簡単な方法があると思います。

Javascript/JQueryとJSONは非常に新しいです。「 ProductID 」というキーがあるようですが、読んでいるものすべてが1つのキーを参照しているわけではありません。まるで、名前/値のすべての名前がキーと見なされます。

これを行う方法の良い例を見つける私の問題は、おそらくここに含まれるすべての正しい用語を知らないことに関係しています。

目的のProductIDがvarProductIdに文字列として格納されている場合、上記のJSONからオブジェクトを取得する方法の例をJQueryで見せてもらえますか？（var ProductID = "000002";）

また、JSONとJQueryに関する優れたリファレンスへのリンクもありがたいです。私はjson.orgや他のいくつかに行ったことがありますが、私の知識レベルではあまり役に立ちません。：S

4

1 に答える 1

3

指定された製品IDを持つ対応する要素を検索する場合は、関数を使用できます.grep()。

このような：

var productID = '000002';
var images = $.parseJSON($("#[id*='hfImages']").val());
var filteredImages = $.grep(images, function() {
    return this.ProductID == productID;
});

if (filteredImages.length > 0) {
    // at least one element inside the images array matched the filter criteria
    var product = filteredImages[0];

    // you could use product.Small, product.Medium, ... here
}
于 2012-06-23T21:26:11.097 に答える