リストのすべての項目のクリック機能を持つリストをループします。 MobileFirst

Question

function displayFeeds(items){ 
    var ul = $('#itemsList'); 
    for (var i = 0; i < items.length; i++) { 
     var li = $('<li/>', { 
     click: function() { 
      alert(i); 
     }, 
     class : "ggwapi" 
     }).text(items[i].Title); 

     var pubDate = $('<div/>', { 
     'class': 'pubDate' 
     }).text(items[i].imdbID); 

     li.append(pubDate); 

     ul.append(li); 

    } 
} 

コードは、上記の機能をアイテム名前付きリストからJSON形式のデータを取得する取得displayFeedsあります。最初のforループは、リストからすべてのアイテムを取得する方法を反復し、< li>タグ内の特定のHTMLに追加するループです。すべて（クラス、クリック機能、指定されたテキストの表示、アラート/ msgboxの表示など）は、このコードでは1部を除いてうまくいく。

アラートボックスに表示されるメッセージ（iの値とする）は同じです。私がリストから10レコードを持っているとしましょう。リストからアイテムをクリックするたびに、それらはすべてmsgboxに "10"と表示されます。私が望むのは、彼らが持っているインデックス番号を表示することです。リストの最初の項目は「1」、2番目の項目は「2」などと表示されます。 。

誰かがこの:(で私を助けてくださいありがとうございました

PS：私は日食ルナを使用しています

Answer 1

それらはすべて同じだから、それぞれ1つの独自のクリック機能を与えないでください。代わりに、各IDにiと等しいidを与え、idを警告するクラスを持つすべての要素に対して1つのクリック機能を作ってください。

function displayFeeds(items) { 
    var ul = $('#itemsList'); 
    for (var i = 0; i < items.length; i++) { 
     var li = $('<li/>', { 
     class : "ggwapi", 
     id : i 
     }).text(items[i].Title); 

     var pubDate = $('<div/>', { 
     'class': 'pubDate' 
     }).text(items[i].imdbID); 

     li.append(pubDate); 

     ul.append(li); 
    } 
} 

$('.ggwapi').click(function() { 
    var itemID = $(this).attr('id'); 
    alert(itemID); 
});