0

http://keith-wood.name/countdown.htmlを使用して、カウントダウンタイマーに取り組んでいます。

私のコードは次のようになります。

$('.clock').countdown({until:new Date(2012, 11, 31), format: 'odHMS', onTick:watchCountdown, tickInterval:5, layout:
    '<div id="timer">' +
        '<div id="timer_labels">'+
            '<div id="timer_months_label" class="timer_labels">Months</div>'+
            '<div id="timer_weeks_label" class="timer_labels">Days</div>'+
            '<div id="timer_days_label" class="timer_labels">Hours</div>'+
            '<div id="timer_minutes_label" class="timer_labels">Minutes</div>'+
        '</div>'+
        '<div id="timer_months" class="timer_numbers"><span class="divide"></span><span>{onn}</span></div>'+
        '<div id="timer_days" class="timer_numbers"><span class="divide"></span><span>{dnn}</span></div>'+
        '<div id="timer_hours" class="timer_numbers"><span class="divide"></span><span>{hnn}</span></div>'+
        '<div id="timer_minutes" class="timer_numbers"><span class="divide"></span><span>{mnn}</span></div>'+
    '</div>'
});

onTick として、次のような関数を呼び出します。

function watchCountdown(periods) { 
var $div = $("#monitor");
var html = $div.html();
var checking = setInterval(function() {
    var newhtml = $div.html();
    if (html !== newhtml) {
        myCallback($div);
    }
},100);
$('#monitor').html('<div id="timer_minutes" class="timer_numbers"><span class="divide"></span><span class="minutes">' + periods[5] + '</span></div>');

}

上記の関数では、html != newhtml のチェックがありますが、#monitor 要素に HTML がありますが、html は夕方の空の変数として返されます。チェックするコンテンツがあることを認識させるにはどうすればよいですか?

4

1 に答える 1

2

DOM の準備ができているものを理解していません。DOM が完全に読み込まれ、サーバーからレンダリングされたときに、一度だけ起動します。

JavaScript で DOM を変更しても、DOM Ready イベントには影響しません。

$('#monitor').html('<div id="timer_minutes" class="timer_numbers"><span class="divide"></span><span class="minutes">' + periods[5] + '</span></div>');

上記のコードは、遅延を引き起こしたり、DOM Ready イベントを再度トリガーしたりすることはありません。

于 2012-06-27T10:27:52.137 に答える