购物站中的抢购倒计时的效果实现

cs文件代码：

//获取多个产品的结束时间距离现在时间的秒数，中间用“，”隔开

if (dtPanicBuy.Rows.Count > 0)

        {

            foreach (DataRow dr in dtPanicBuy.Rows)

            {

                time_info += DateTime.Parse(dr["EndTime"].ToString()).Subtract(DateTime.Parse(DateTime.Now.ToString())).TotalSeconds.ToString() + ",";

            }

        }

        time_info = time_info.Substring(0, time_info.Length - 1);

aspx文件代码：

<%if (dtPanicBuy.Rows.Count > 0)

                                  {

                                      int i = 0;

                                      foreach (DataRow dr in dtPanicBuy.Rows)

                                      {

                                          i++;%>

<div class="spare_name">剩余<b class="days<%=i-1 %>"  id="days<%=i-1 %>"></b>天<b class="hours<%=i-1 %>" id="hours<%=i-1 %>"></b>时<b class="minutes<%=i-1 %>" id="minutes<%=i-1 %>"></b>分<b class="seconds<%=i-1 %>" id="seconds<%=i-1 %>">0</b>秒</div>

<%}

                                  } %>

<script type="text/javascript">

                        var brand_adjust_time = 0;

                        var brand_time_info = [<%=time_info%>];

                        brand_time_init();

                    </script>

js文件代码：

function brand_time_init() {

var brand_end_time, b_d, b_h, b_m;

for (var i=0; i<brand_time_info.length; i++) {

brand_end_time = brand_time_info[i] - brand_adjust_time;

b_d = Math.floor(brand_end_time/86400);

b_h = Math.ceil(brand_end_time/(3600))-b_d*24-1;

b_m = Math.floor((brand_end_time - b_d * 86400 - b_h * 3600) / 60);

b_s = Math.floor(brand_end_time - b_d * 86400 - b_h * 3600-b_m*60)

$('.days' + i).html(b_d);

$('.hours'+i).html(b_h);

$('.minutes' + i).html(b_m);

$('.seconds'+i).html(b_s);

}

setInterval(brand_timer, 1000);

}

function brand_timer()

{

    var second, minute, hour, day;

for (var i=0; i<brand_time_info.length; i++) {

   second = parseInt($("#seconds" + i).text());

if (second == 0 && minute == 0 && hour == 0 && day == 0) {

   continue;

}

minute = parseInt($("#minutes" + i).text());

hour = parseInt($("#hours" + i).text());

day = parseInt($("#days" + i).text());

if (0 < second) {

second-=1;

$(".seconds"+i).html(second);

}

else

{

second=minute==0?0:59;

$(".seconds" + i).html(second);

if(0<minute)

{

minute-=1;

$(".minutes"+i).html(minute);

}

else

{

minute=hour==0?0:59;

$(".minutes"+i).html(minute);

if(0<hour)

{

hour-=1;

$(".hours"+i).html(hour);

}

else

{

if(0<day)

{

hour=23;

day-=1;

$(".days"+i).html(day);

$(".hours"+i).html(hour);

}

else

{

   $(".days"+i).html("0");

   $(".hours"+i).html("0");

}

}

}

}

}

}

PS：由于一些特殊原因 导致标签里面有class和id两个相同的名称，其实实际中只需要写一个就够了，当然js中的代码也要对应修改。