変数を使用して特定のコンテンツを表示する方法は？

Question

hrefをクリックすると、ターゲットIDから画像と説明が表示されます。誰かが私のためにこのコードを修正し、それを正しく行う方法を教えてもらえますか？どうもありがとうございました！

HTML：

<div id="gallery"><img/></div> 
    <a href="#panorak">Click me</a> 

のjQueryコード：

var datas={ 
      "images":[{ "src":"gallery/panorak.jpg", 
         "title":"PANORAK", 
         "date":"28/10/2010 Web Design", 
         "description":"desc", 
         "id":"panorak", 
         }, 
         { 
         "src":"gallery/kamoa.jpg", 
         "title":"kamoa", 
         "date":"28/10/2010 Web Design", 
         "description":"desc", 
         "id":"kamoa", 
         }, 
        ]}; 
$(document).ready(function(){ 
    var gallery=$("#gallery") 

    //****I don't know how to display it right at this point 

    var list=$("<ul/>"); 
    gallery.append(list); 
    datas.images.each(function(i,j){ 
     list.prepend($("<li/>").$("<img/>").attr("src",datas.images[i].src).load(function(){ })); 
    }); 
}); 

すべてのヘルプは大歓迎です！どうもありがとうございました！あなたが何かをクリックしたときにイベントをトリガしたい場合は、click()機能を使用することができます

$(document).ready(function(){ 
    var gallery=$("#gallery") 

    //****I don't know how to display it right at this point  

    $('a').click(function(){ 
     var list=$("<ul/>"); 
     gallery.append(list); 
     $.each(datas.images, function(i,j){ 
      var img = $("<img/>").attr("src",datas.images[i].src); 
      list.prepend($("<li/>").append(img)); 
     }); 
    }); 
}); 

：

Answer 1

：

http://jsfiddle.net/T5r6D/

は、すべての更新のための私のjsfiddleのリンクを見てください。 フローの問題やjavascriptエラーの構造があります。

通常のforループを使用して、すべてのイメージを配列に追加します。一度ループが完了したら、私は<li>と画像をラップし、ステージにリストを追加します。

イメージはjsfiddleサーバーに表示されないため表示されません。あなたの側でそれを試してください。

UPDATE

http://jsfiddle.net/T5r6D/1/

だから、新しい更新プログラムは、フルコンテナを隠しません。

アンカー#tag [href]は画像のタイトルタグと一致します。一度ボタンをクリックすると、一致する画像が隠されます。

Answer 2

はこれを試してみてください。そして、私はeach()の機能部分を修正しました。これをチェックしてくださいdocumentation。そして、わかりやすくするためにいくつかのコードを分割しました。私はあなたのコードにいくつかの変更を加えた