Запуск.post() для каждого элемента с использованием jQuery

У меня проблемы с запуском jQuery .post над каждым элементом в моей таблице. Ниже мой код

HTML

<table>
    <tr>
        <td class="load_img"></td>
        <td class="load_img"></td>
        <td class="load_img"></td>
        <td class="load_img"></td>
        <td class="load_img"></td>
        <td class="load_img"></td>
        <td class="load_img"></td>
        <td class="load_img"></td>
    </tr>
</table>

Javascript

   $(document).ready(function(){
    $("td.load_ads").html("<img src='/classified_ads4free/images/icons/ajax-loader.gif'>");
     $("td.load_ads").each(function(){
       var loading=$(this);

       $.post('/classified_ads4free/self_coded_helpers/jpost_get_ads.php',function(data)
       {
          loading.html(data);
       });
     });
    });

PHP скрипт

 <?php
   $index=rand(0,10);
   echo $index;
 ?>

Так что я пытаюсь сделать здесь, чтобы каждый <td> в моей таблице загрузить случайное число, но моя проблема сейчас в том, что все <td>Загружается одно и то же случайное число. Вместо каждого случайного числа от 0 до 10.

(это только для иллюстрации, я знаю, что можно генерировать случайное число с помощью jquery, но цель, почему мне нужно сделать .post потому что я буду выполнять запросы для загрузки изображений внутри этих элементов таблицы.)

4 ответа

Решение

Спасибо всем за помощь. Получил это решено. То, что я сделал, было создать индекс искусственной переменной. Затем каждый раз, когда я запускаю.post с новым циклом, получим приращение индекса. Не знаю почему, но это работает так, как мне хотелось бы. Мой новый код javascript следующий, если это кому-нибудь нужно.

   $(document).ready(function(){
    $("td.load_ads").each(function(){
        var loading=$(this);
        var index=0;
        $(this).html("<img src='/classified_ads4free/images/icons/ajax-loader.gif'>");
        $.post('/classified_ads4free/self_coded_helpers/jpost_get_ads.php',{index:index},function(data){
            loading.html(data);
            index=index+1;
        });
    });
   }); 

Вероятно, это проблема кеша.
Поскольку ваш запрос всегда один и тот же, браузер отправляет запрос только один раз.
Решения:

1 / добавьте html-заголовок в ваш php-скрипт, чтобы не кэшировать ответ:

header("Cache-Control: no-cache, must-revalidate");  
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT");

2 / добавить случайный параметр в запрос

Вы пробовали так:

   $(document).ready(function(){
    $("td.load_ads").html("<img src='/classified_ads4free/images/icons/ajax-loader.gif'>");
     $.post('/classified_ads4free/self_coded_helpers/jpost_get_ads.php',function(data){
       $.each($("td.load_ads"), function(){
         var loading=$(this);   
         loading.html(data);
       });
     });
  });

I think you should iterate in the success function.

Кажется, это проблема кеширования.

Самый простой обходной путь - добавить случайное число в URL.

var d = new Date();

$.post( '/classified_ads4free/self_coded_helpers/jpost_get_ads.php'
        + '?_=' + d.getTime()
        + '&_=' + Math.random(),
        function( data ) { /* stuff */ }
);
Другие вопросы по тегам