jQueryカウントダウンリロードdiv

Question

jquery.countdownでカウントダウンしようとしています。

目的は、カウントダウンに最初の日付を設定し、カウントダウンが完了したときに特定のdivをリロードして、新しいカウントダウンの新しい日付を設定することです。

私の問題は、divがリロードされたときです。 2回目のカウントダウンは決して始まらない。 おそらく、スクリプトはリロードされません。

ここに私のコード：

$(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スクリプトをリロードする必要があるが、私はそれを行うのか分かりません。

Answer 1

はそれという名前の関数にし、​​コールバックにそれを再呼び出ししてください：それは完璧に動作

$(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(); 
});