在一页中多次倒计时

首先，我使用jalali/persian日期和倒计时jQuery插件不适用于我。对于ex插件，必须输入格式如2017/5/2，但波斯/加拉里日期为1396/2/17。在一页中多次倒计时

我有指定日，小时，分和秒的多个日期时间。例如：

3天13小时4分钟25秒

23天2小时41分钟3秒...

我有天，小时，分钟和秒的单独的，

我想倒计时他们在一个页面日期（他们的日期数量daynamic）

我用这个代码，做工精细，当只在一个页面日期

HTML：

<div class="row"> 

@{TimeSpan span = (item.DiscountExpireDate - DateTime.Now);} 

    <ul class="countdown"> 
     <li> 
      <span class="seconds">@span.Seconds</span> 
     <p class="seconds_ref">ثانیه</p> 
     </li> 
     <li class="seperator">:</li> 
     <li> 
     <span class="minutes">@span.Minutes</span> 
      <p class="minutes_ref">دقیقه</p> 
      </li> 
      <li class="seperator">:</li> 

      <li> 
      <span class="hours">@span.Hours</span> 
      <p class="hours_ref">ساعت</p> 
      </li> 
      <li class="seperator"> </li> 
      <li> 
      <span class="days">@span.Days</span> 
     <p class="days_ref">روز</p> 
     </li> 
     </ul> 

</div>

和js

<script type="text/javascript">//for countdown 
    $(document) 
     .ready(function() { 
      var theDaysBox = $(".days"); 
      var theHoursBox = $(".hours"); 
      var theMinsBox = $(".minutes"); 
      var theSecsBox = $(".seconds"); 

       var refreshId = setInterval(function() { 
         var currentSeconds = theSecsBox.text(); 
         var currentMins = theMinsBox.text(); 
         var currentHours = theHoursBox.text(); 
         var currentDays = theDaysBox.text(); 

         if (currentSeconds == 0 && currentMins == 0 && currentHours == 0 && currentDays == 0) { 
          // if everything rusn out our timer is done!! 
          // do some exciting code in here when your countdown timer finishes 

         } else if (currentSeconds == 0 && currentMins == 0 && currentHours == 0) { 
          // if the seconds and minutes and hours run out we subtract 1 day 
          theDaysBox.html(currentDays - 1); 
          theHoursBox.html("23"); 
          theMinsBox.html("59"); 
          theSecsBox.html("59"); 
         } else if (currentSeconds == 0 && currentMins == 0) { 
          // if the seconds and minutes run out we need to subtract 1 hour 
          theHoursBox.html(currentHours - 1); 
          theMinsBox.html("59"); 
          theSecsBox.html("59"); 
         } else if (currentSeconds == 0) { 
          // if the seconds run out we need to subtract 1 minute 
          theMinsBox.html(currentMins - 1); 
          theSecsBox.html("59"); 
         } else { 
          theSecsBox.html(currentSeconds - 1); 
         } 
        }, 
        1000); 

     }); 
</script>

，但是当我有页上的多个日期不能很好地工作，它似乎是数字相加在一起。

https://jsfiddle.net/a7ucv468/1/

任何人都可以帮我吗？

来源

2017-04-14 Arman Spr

你只需要确定包装元素为每一个这样的：

$('.countdown").each(function {

然后在你的元素选择前使用$（本）.find（）。这将把函数绑定到倒数的每个实例。目前它只是寻找类“天”，所以它只会使用它找到的第一个，或导致其他错误。我会很快写一个工作的例子。

我不确定数字，但他们似乎是在这里独立运行（设置超时为较少的调试）https://jsfiddle.net/7nzcdhn3/

来源

2017-04-14 10:18:42

在一页中多次倒计时

回答

相关问题