使用数据库日期创建倒数计时器

时间:2014-05-05 23:49:39

标签: javascript mysql datetime

我是javascript的新手,我真的很困惑我需要做什么。我在我的网站上添加了一个javascript倒计时器,很容易添加。

这是javascript:

<script LANGUAGE="JavaScript">
// This following statement must be left intact.
// Copyright (c) Michael Bloch and Taming The Beast.
// Countdown timer script v1.2 April 20 2009
// Taming the Beast.net - http://www.tamingthebeast.net
// Free Web Marketing and Ecommerce articles and tools
// By using this code you agree to indemnify Taming the Beast
// from from any liability that might arise from its use.
// The preceding statement be left intact.


var present;
var future;
var tseconds;
var seconds;
var minutes;
var hours;
var days;
ID=setTimeout("countdown();", 1000);

function countdown()
{
present = new Date();
present = present.getTime() + (60000) + (12 * 60 * 60 * 1000);
future = new Date("June 30, 2014 12:10:30");

tseconds = (future - present) / 1000;

days = tseconds /24/60/60;
days = Math.floor(days);
tseconds = tseconds - (days * 24 * 60 * 60);

hours = tseconds /60/60;
hours = Math.floor(hours);
tseconds = tseconds - (hours * 60 * 60);

minutes = tseconds /60;
minutes = Math.floor(minutes);
tseconds = tseconds - (minutes * 60);

seconds = tseconds;
seconds = Math.floor(seconds);

document.getElementById('days').innerHTML = days;
document.getElementById('hours').innerHTML = hours;
document.getElementById('minutes').innerHTML = minutes;
document.getElementById('seconds').innerHTML = seconds;
ID=setTimeout("countdown();", 1000);
}
</script>

这是在页面上显示计时器的代码:

<SPAN id="days">0</SPAN> &nbsp;days &nbsp;&nbsp;
<SPAN id="hours">0</SPAN> &nbsp;hr.&nbsp;&nbsp;
<SPAN id="minutes">0</SPAN>&nbsp;min,&nbsp;
<SPAN id="seconds">0</SPAN>&nbsp;sec.&nbsp;

但是,计时器正在使用javascript中指定的日期。我需要它来使用mysql数据库中的日期。我需要一个倒数计时器来显示产品销售何时结束。它需要根据产品ID提取正确的日期。

我安装了一个模块,显示销售结束的日期。它不使用javascript,它只是php。我想知道我是否可以用javascript来显示倒计时而不是结束日期?

这是从数据库中获取我现在使用的模块的结束日期的函数:

<?php 
// Sale Special Ending - Copyright That Software Guy, Inc. 2010.
// http://www.thatsoftwareguy.com
// Some portions copyright 2003-2010 Zen Cart Development Team
// Some portions copyright 2003 osCommerce
function countdown($id, $longdate = true, $one_day_back = false) { 
   $id = (int)$id; 
   global $db; 

   if (zen_get_products_special_price($id, true)) {
      $specials = $db->Execute("select expires_date, UNIX_TIMESTAMP(expires_date) as unix_expires_date from " . TABLE_SPECIALS . " where products_id = '" . $id . "' and status='1' AND expires_date !='0001-01-01'");
      if (!$specials->EOF) { 
         if (!$one_day_back) { 
            $enddate = $specials->fields['expires_date']; 
         } else { 
            $enddate = $specials->fields['unix_expires_date']; 
            $enddate_ts = strtotime("-1 day", $enddate);
            $enddate = date("Y-m-d H:i:s", $enddate_ts); 
         }
         if ($longdate) {
            $date_str = zen_date_long($enddate);
         } else { 
            $date_str = zen_date_short($enddate);
         }
         return $date_str; 
      }
   } 
   if (zen_get_products_special_price($id, false)) { 
      $product_price = zen_get_products_base_price($id);
      $product_to_categories = $db->Execute("select master_categories_id from " . TABLE_PRODUCTS . " where products_id = '" . $id . "'");
      $category = $product_to_categories->fields['master_categories_id'];
      $sales = $db->Execute("select sale_date_end, UNIX_TIMESTAMP(sale_date_end) as unix_sale_date_end from " . TABLE_SALEMAKER_SALES . " where sale_categories_all like '%," . $category . ",%' and sale_status = '1' and (sale_date_start <= now() or sale_date_start = '0001-01-01') and (sale_date_end >= now() or sale_date_end = '0001-01-01') and (sale_pricerange_from <= '" . $product_price . "' or sale_pricerange_from = '0') and (sale_pricerange_to >= '" . $product_price . "' or sale_pricerange_to = '0')");
      if ($sales->EOF) return ''; 
      if ($sales->fields['sale_date_end'] == '0001-01-01') return ''; 
      if (!$one_day_back) { 
         $enddate = $sales->fields['sale_date_end']; 
      } else { 
         $enddate = $sales->fields['unix_sale_date_end']; 
         $enddate_ts = strtotime("-1 day", $enddate);
         $enddate = date("m d Y H:i:s", $enddate_ts); 
      }
      if ($longdate) {
         $date_str = zen_date_long($enddate);
      } else { 
         $date_str = zen_date_short($enddate);
      }
      return TEXT_SALE_EXPIRES . $date_str; 
   }
   return ''; 
}
?>

这是在产品页面上显示结束日期的代码:

<!--bof Sale Special Ending block -->
<?php
$ssblock = countdown((int)$_GET['products_id']);
if ($ssblock != '') {
  echo "<div class='ssblock'>" . $ssblock . "</div>"; 
}
?>
<!--eof Sale Special Ending block -->

我无法弄清楚如何让它一起工作。

2 个答案:

答案 0 :(得分:1)

您可以使用PHP从数据库中获取日期,然后编写脚本标记以设置倒计时状态的开始日期。

我假设您知道如何从数据库中获取日期,因为您已经有一个显示结束日期的模块。

假设日期在$end。以下内容......比如,在JavaScript中创建一个future全局变量。

<script>var future = new Date("<?php echo $end; ?>");</script>

然后使用硬编码日期

删除该行
future = new Date("June 30, 2014 12:10:30");

无论如何,有很多方法可以改进这个答案中的代码。

答案 1 :(得分:0)

我为你做这个,也许可以帮到你:

http://jsfiddle.net/CnV5A/

var days=10,hours=1,minutes=1,seconds=5;

var container = document.getElementById("countdown");

function countdown(){
        if(seconds == 0){
            seconds = 59;
            minutes--;
        }else{
            seconds--;
        }
        if(minutes == -1){
            minutes = 59;
            hours--;
         }
         if(hours == -1){
             days--;
        }
    container.innerHTML = "days:"+days+", hours:"+hours+", minutes:"+minutes+", seconds:"+seconds;
    setTimeout(countdown,1000);

    }

countdown();