1 つのページに複数のオークションのステータスを表示する必要があるプロジェクトに取り組んでいます。アイテムごとに終了日が異なります。各行に一意の ID を与え、その ID を使用して時間を設定しますが、設定されるのは 1 回だけです。これは私のスクリプトコードです:
<script>
$(document).ready(function(){
$('tr[id]').each(function () {
var $this = $(this);
var endDate = new Date();
var count = $this.attr("id");
var year = parseInt(count.slice(0,4));
var month = parseInt(count.slice(4,6));
var day = parseInt(count.slice(6,8));
var hour = parseInt(count.slice(8,10));
var minute = parseInt(count.slice(10,12));
var second = parseInt(count.slice(12,14));
endDate.setFullYear(year, month - 1, day);
endDate.setHours(hour+1);
endDate.setMinutes(minute);
endDate.setSeconds(second);
$('.countdown-styled').countdown({
until: endDate,
format: 'dHMS',
render: function(data) {
var el = $(this.el);
el.empty()
.append("<div>" + this.leadingZeros(data.days, 2) + " <span>days</span></div>")
.append("<div>" + this.leadingZeros(data.hours, 2) + " <span>hrs</span></div>")
.append("<div>" + this.leadingZeros(data.min, 2) + " <span>min</span></div>")
.append("<div>" + this.leadingZeros(data.sec, 2) + " <span>sec</span></div>")
}
});
});
});
</script>
そして、これは私のテーブルのレイアウトです:
<body>
<table id="timerTable">
<tr id="20130425190000">
<div class="countdown-styled" style="width:200px;"></div>
</tr>
<tr id="20130416190000">
<div class="countdown-styled" style="width:200px;"></div>
</tr>
<tr id="20130424190000">
<div class="countdown-styled" style="width:200px;"></div>
</tr>
このコードは、テーブル内のすべてのカウントダウンの同じ時間を同じ時間に設定します。(つまり、13 日 3 時間 58 分 24 秒 9 ) 何かアイデアはありますか?
編集: ID を使用する場合は、この形式にする必要があります。これはサーバーから動的に設定され、この形式で返されます。それが私が使用parseInt
し、slice
それを私のやり方で使用する理由です。形式は、年/月/日/時/分/秒 (XXXXXXXXXXXXXX) です。