jQuery AJAX each problems

Question

私はjqueryを使用していますが、私は以下のようなスクリプトを持っています。

$(document).ready(function() { 
$('.nm').each(function(row) { 
$.ajax({ 
    type: 'POST', 
    url: 'test.php', 
    data: 'id=' + 1, 
    dataType: 'json', 
    cache: false, 
    success: function(result) { 
    $('.title').each(function(index){ 
     if (result) { 

     $(this).html(result[index]); 

     } else { 
      $(this).html(" "); 
      } 
     }); 
    }, 
}); 
}); 
}); 

スクリプトはテーブル内のテキストを変更すると考えられます。

<tr class="nm" style="height: 30px"> 
     <td style="width: 15px;">&nbsp;</td> 
     <td class="section" colspan="5">Mix</td> 
     <td style="width: 15px;">&nbsp;</td> 
    </tr> 
    <tr> 
     <td id="prev" rowspan="2"><<</td> 
     <td class="content">&nbsp;</td> 
     <td class="content">&nbsp;</td> 
     <td class="content">&nbsp;</td> 
     <td class="content">&nbsp;</td> 
     <td class="content">&nbsp;</td> 
     <td id="next" rowspan="2">>></td> 
    </tr> 
    <tr> 
     <td class="title" >&nbsp;</td> 
     <td class="title" >&nbsp;</td> 
     <td class="title" >&nbsp;</td> 
     <td class="title" >&nbsp;</td> 
     <td class="title" >&nbsp;</td> 
    </tr> 


    <tr class="nm" style="height: 30px"> 
     <td style="width: 15px;">&nbsp;</td> 
     <td class="section" colspan="5">Mix</td> 
     <td style="width: 15px;">&nbsp;</td> 
    </tr> 
    <tr> 
     <td id="prev" rowspan="2"><<</td> 
     <td class="content">&nbsp;</td> 
     <td class="content">&nbsp;</td> 
     <td class="content">&nbsp;</td> 
     <td class="content">&nbsp;</td> 
     <td class="content">&nbsp;</td> 
     <td id="next" rowspan="2">>></td> 
    </tr> 
    <tr> 
     <td class="title" >&nbsp;</td> 
     <td class="title" >&nbsp;</td> 
     <td class="title" >&nbsp;</td> 
     <td class="title" >&nbsp;</td> 
     <td class="title" >&nbsp;</td> 
    </tr> 

ご覧のとおり、テーブルは6行あり、3行の繰り返し形式です。内容は、5人のメンバーを含むjson encoded arrayをエコーするtest.phpファイルで満たされます。このようにして、class="title"の5つのセルがすべて正常に移植されます。しかし、class="title"と2番目のセットがいっぱいになっていません..私はeach(function(row)class="nm"を持つすべての行のためのajax呼び出しを繰り返すようにした。しかし、これは動作していません..私は[index]は、配列に5つ以上のメンバーを提供する場合、残りのセルが設定されているので、ajaxの後にリセットされていないと思う。しかし、私は、すべての行がclass="nm"を持っていることを繰り返した後に、ajaxリクエストを繰り返す必要があり、データを書き込むことを希望します。

どうすればいいですか？

事前のおかげで...

Answer 1

$('.title')常にを選択every.title要素。セットを特定のものに制限しているわけではありません。何とかセレクタを.nmに依存させる必要があります。例えば

：

$('.nm').each(function() { 
    var $row = $(this); 
    $.ajax({ 
     type: 'POST', 
     url: 'test.php', 
     data: 'id=' + 1, 
     dataType: 'json', 
     cache: false, 
     success: function(result) { 
      var $titles = $row.next().next().children('.title'); 
      if (result) { // it's enough to check *once* whether it is set 
       $titles.html(function(index){ // easier 
        return result[index]; 
       }); 
      } 
      else { 
       $titles.html(" "); 
      } 
     }); 
    }); 
}); 

これは、あなたが提供する構造で動作するはずです。 $rowはそれぞれ<tr class="nm">行を参照し、$row.next().next()は.title要素を含む行である2番目の次の兄弟を選択します。
構造を変更すると壊れます。

あなたが.title要素、独自のクラスを含む行与えれば良いだろう：

<tr class="something"> 
    <td class="title" >&nbsp;</td> 
    <!-- ... --> 
</tr> 

を次にあなたが代わりに.nm行のそれらの反復、および$row.children('.title')と.title要素を取得することができます。

Answer 2

あなたのインデックスはあなたのAJAX呼び出しから返される配列のサイズよりも大きくなる場合は、配列内に存在しないインデックスを参照しますが。索引でモジュロ関数を使用することを検討しましたか？同様に：

result[index % result.length] 

これはあなたが決してインデックス配列の外側にいることを確認して、インデックスが配列のサイズを超えると、[インデックス％のresult.length]は再び最初の要素から開始するようにラップしている必要があります。

これがあなたが探しているものかどうかは完全にはわかりません...？！？

Answer 3

私は（結果）これは、各機能に機能してTHIS異なると思う第二の機能（結果）

を呼び出す前に、変数にこれを代入してみ

each(function(row) { 
$.ajax({ 
type: 'POST', 
url: 'test.php', 
data: 'id=' + 1, 
dataType: 'json', 
cache: false, 
success: function(result) { 
$('.title').each(function(index){ 
    if (result) { 

    $(this).html(result[index]);