Как получить доступ к динамическому контенту в списке из setInterval

0

В javascript, On $(document).ready(function() У меня есть функция updateRecordTime() для обновления дат в элементах списка (с вложенными div), и у меня есть функция setInterval() которая работает каждые 30 секунд для обновления, но после динамического добавления элементов списка через ajax они также не обновляются. У меня есть функция, выполняющаяся на статическом элементе, чтобы посмотреть на неупорядоченный список для его элементов списка, но его не работает, и я не могу понять это.

  updateRecordTime = function () {
      $('#record-lister > li').each(function (index) {
          var record_time = $(this).find('.record-time');
          date = moment(new Date(record_time.attr('data-date')));
          update = function () {
              record_time.html('Record - ' + date.fromNow() + ' <i class="icon-time"></i>');
          };
          update();
      });
  }

  updateRecordTime();
  setInterval(updaterecordTime, 30000);

Html (соответствующий код) выглядит следующим образом

<ul id="record-lister">
    <li>
         <div class="record-time" data-date="'.date('Y-m-d H:i:s', $timestamp).'">
              gets replaced with moment time....                                                            
         </div>
    </li>
    <li>
        <div class="record-time" data-date="'.date('Y-m-d H:i:s', $timestamp).'">
              gets replaced with moment time....                                                            
        </div>
    </li>
</ul>

Если я вызываю функцию после успешного вызова ajax, она обновляется один раз, но цикл ее не находит, я знаю, что setInterval() будет зацикливать исходные элементы списка, но как я могу заставить его также найти динамически добавленные слишком?

Теги:
setinterval

1 ответ

0
Лучший ответ

Как сказал А.Вольф, ваш код должен найти вновь вставленные теги li.

  1. Убедитесь, что вы правильно заполняете тег ul, имеющий id = "record-lister". Вы можете проверить динамический код html, чтобы убедиться в этом.
  2. Следите за ошибками js с консоли браузера, чтобы код не прерывался в какой-то момент. Я рекомендую вам Firebug или Chrome Dev Tools.
  3. При вызове setInterval (funcName, interval) вы должны знать, что funcName является указателем на вашу функцию, и вы должны обратить внимание на области функций. Вызов setInterval ("funcName()", интервал) вызовет funcName из глобальной области (например, window.funcName).

Основываясь на приведенном здесь коде, это мои советы, и он должен работать очень хорошо, предполагая, что добавление html-кода через ajax работает хорошо.

  • 0
    Оказывается, в html записи добавления отсутствовал атрибут data-date, тогда как цикл загрузки записей при загрузке страницы был в порядке, ура @eAbi

Ещё вопросы

Сообщество Overcoder
Наверх
Меню