2017-08-11 63 views
0

我嘗試用jquery.countdown做倒計時。jQuery倒計時重裝div

目標是設置倒計時的第一個日期,並在倒計時完成時重新加載特定的div以設置新倒計時的新日期。

我的問題是當div重新加載。第二次倒計時從未開始。 可能該腳本不會重新加載。

這裏我的代碼:

$(document).ready(function() { 
    $('[data-countdown]').each(function() { 
    var $this = $(this), 
     finalDate = $(this).data('countdown'); 

    $this.countdown(finalDate, function(event) { 
     $this.html(event.strftime('%H:%M:%S')); 
     $this.countdown(finalDate) 
     .on('update.countdown', function(event) { $this.html(event.strftime('%H:%M:%S')); }) 
     .on('finish.countdown', function() { $('#time').load(location.href + " #time"); }); 
    }); 
    }); 
}); 
<div id="time"> 
    <?php 
    $h1=date("H:i"); 
    $date=date("Y-m-d"); 

    $sqlTime="select heure from table where heure>'$heure' and dateReunion='$date' order by heure asc LIMIT 1"; 
    $resTime=mysql_query($sqlTime) or exit('Erreur SQL ligne '.__LINE__.' : '.mysql_error()); 

    $newDate=mysql_result($resTime,0,0); 
    $time=$date." ".$newDate.":00"; 

    ?> 

    <button class="btn btn-primary btn-round" data-countdown="<?php echo $time; ?> "></button> 
</div> 
<script src="assets/js/jquery.min.js" type="text/javascript"></script> 
<script src="assets/js/bootstrap.min.js" type="text/javascript"></script> 
<script src="assets/js/jquery.countdown.js"></script> 

我想,我必須重新加載JS腳本,但我不知道這樣做。

回答

0

儘量做到一個名爲功能並重新調用它​​回調:

$(document).ready(function() { 

    function initCountdown(){ 
    $('[data-countdown]').each(function() { 
     var $this = $(this), 
     finalDate = $(this).data('countdown'); 

     $this.countdown(finalDate, function(event) { 
     $this.html(event.strftime('%H:%M:%S')); 
     $this.countdown(finalDate) 
      .on('update.countdown', function(event) { 
      $this.html(event.strftime('%H:%M:%S')); 
      }) 
      .on('finish.countdown', function() { 
      $('#time').load(location.href + " #time", initCountdown); // Recall the init function on load callback 
      }); 
     }); 
    }); 
    } 

    // on page first load. 
    initCountdown(); 
}); 
+0

感謝它完美的作品:) – JulesMartin

+0

太好了!你能將答案標記爲已接受嗎? –