2017-08-11 103 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

太好了!你能将答案标记为已接受吗? –