0

JavaScriptでは、(ネストされたdivを使用して)リスト項目の日付を更新$(document).ready(function()する関数を実行し、30秒ごとに更新する関数を実行していますが、ajaxを介してリスト項目を動的に追加した後も更新されません。リスト項目の順序付けられていないリストを調べる関数を静的要素で実行していますが、機能していないため、わかりません。updateRecordTime()setInterval()

  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()。元のリスト項目をループすることはわかっていますが、動的に追加されたものも見つけるにはどうすればよいですか?

4

1 に答える 1

0

A.Wolfが言ったように、コードは新しく挿入された li タグを見つける必要があります。

  1. id="record-lister" を持つ ul タグが正しく設定されていることを確認してください。これを確認するために、動的に追加された html コードを調べることができます。
  2. コードがどこかで壊れないように、ブラウザ コンソールから js エラーを監視します。Firebug または Chrome Dev Tools をお勧めします。
  3. setInterval(funcName, interval) を呼び出すときは、funcName が関数へのポインターであり、関数のスコープに注意を払う必要があることに注意する必要があります。setInterval("funcName()", interval) を呼び出すと、グローバル スコープ (つまり window.funcName ) から funcName が呼び出されます。

ここで提供されたコードに基づいて、これらは私のアドバイスであり、ajax を介して html コードを追加するとうまくいくと仮定すると、問題なく動作するはずです。

于 2013-09-21T13:24:45.760 に答える