0

わかりましたので、このカウントダウンを実行するのに問題があります。関数にdate-timeforを提供し、毎秒実行したいのですが、何らかの奇妙な理由で未定義のエラーがスローされます。jquery Date()*これは 100% 動的であることに注意してください。ページ上で 1 回のカウントダウン、またはすべてのユーザーに対して 1000 回のカウントダウンが発生する可能性があります。

HTML マークアップ:

    <li class="clu">
    <legend>Clutch # 1</legend>
    <ul class='clutch-des'>
        <li class='it-d'>2012-05-12 23:55:59</li>
        <li class='it'>Remaining: <span class="timeremaining" id="dlvdfovwdfivwsf">
            <span class="hours">03</span>
            <span class="mins">09</span>
            <span class="sec">55</span>
            </span>
        </li>

     </ul>
</li>
<li class="clu">
    <legend>Clutch # 1</legend>
    <ul class='clutch-des'>
        <li class='it-d'>2012-05-12 23:55:59</li>
        <li class='it'>Remaining: <span class="timeremaining" id="dlvdfovwdfivwsf">
            <span class="hours">03</span>
            <span class="mins">09</span>
            <span class="sec">55</span>
            </span>
        </li>

     </ul>
</li>
<li class="clu">
    <legend>Clutch # 2</legend>
    <ul class='clutch-des'>
        <li class='it-d'>2012-05-12 23:55:59</li>
        <li class='it'>Remaining: <span class="timeremaining" id="dlvdfovwdfivwsf">
            <span class="hours">03</span>
            <span class="mins">09</span>
            <span class="sec">55</span>
            </span>
        </li>

     </ul>
</li>
<li class="clu">
    <legend>Clutch # 3</legend>
    <ul class='clutch-des'>
        <li class='it-d'>2012-05-12 23:55:59</li>
        <li class='it'>Remaining: <span class="timeremaining" id="dlvdfovwdfivwsf">
            <span class="hours">03</span>
            <span class="mins">09</span>
            <span class="sec">55</span>
            </span>
        </li>

     </ul>
</li>
​

Jクエリ:

  var a = new Array(); var i = 0;
$('.timeremaining').each(function(index , el){
    var ID = $(this).attr('id');
    // get due date for countdown
    var dd = $(this).parent().parent().children('.it-d').text().split('Due :'); var dd = dd[1];
    var kids = $(this).children();
    $(kids).each(function(){
    a[i] = $(this).attr('class');
    i++;
    });

    Cdtd(x,a[0],a[1],a[2],ID);
});    
function Cdtd(x,hrd,md,sd,ID){

    var dd = new Date(x);
    var now = new Date();
    var dif = dd.getTime() - now.getTime() ;
    if(dif <= 0){
        clearTimeout(CountDown);
        alert('Clutch done!');
    }
    var sec = Math.floor(dif / 1000);
    var min = Math.floor(sec / 60);
    var hr = Math.floor(min / 60);
    var day = Math.floor(hr / 24);
    min %= 60;
    sec %= 60; 
    hr  %= 24;
    $('#'+ID+' '+sd).text (sec+ 'secs');
    $('#'+ID+' '+md).text (min+ 'mins');
    $('#'+ID+' '+hrd).text(hr+  'hrs' );
    var CountDown = setInterval('Cdtd(x,hrd,md,sd)',1000);

}
​
4

2 に答える 2

1

いくつかの変更を加えて、ようやくコードがここで機能するようになりました。また、要素に同じ ID を使用しないでください。それぞれが一意である必要があります。

于 2012-05-13T07:15:59.407 に答える
0

このJavaScript ライブラリを試してください。彼のコードは読みやすく、必要に応じてカスタマイズできます。

于 2012-05-13T06:03:08.400 に答える