倒计时脚本未开始倒计时

有人可以告诉我为什么倒计时功能无法正常工作（倒数计时不是以倒数第一次倒数开始）。可能真的很简单，但Javascript并不是我的特长。这是我使用的倒计时插件：http://keith-wood.name/countdown.html 倒计时脚本未开始倒计时

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>Page Title</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<link href="./css/web-style-second.css" rel="stylesheet" type="text/css"> 
<link rel="stylesheet" type="text/css" href="chrome://mozbar/skin/css/injected.css"> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
<script type="text/javascript" src="js/jquery.countdown.js"></script> 
</head> 
<body> 
<a name="top"></a> 
<div id="container"> 
    <div id="content"> 

<div class="center"> 
    <center> 
     <div></div> 
    </center> 
</div> 

<script type="text/javascript"> 
$(function() { 
    $('#countdown').countdown({ 
     until: '14min+20sec', 
     format: 'MS', 
     layout: '{mnn}min ' + '{snn}sec ', 
     onExpiry: function() { 
      $(".hidden").css("display", "block"); 
     } 
    }); 
}); 
</script> 

<div class="time_box"> 
    <h3 class="italic">When The Clock Hits Zero ... </h3> 
    <h4 class="hasCountdown" id="countdown">14min 20sec </h4> 
</div> 

<form name="signupFrm" id="signupFrm" action="#" method="post" class="hidden"> 
    <div> 
     <div class="yellow_red"> 
      <h1></h1> 
     </div> 
     <div class="center"> 
      <a href="https://www.testing.com" class="btn_buy_now"> 
      Get Started</a> 
     </div> 
     <input name="submit" value="submit" type="hidden"> 
     <p class="mb_5">&nbsp;</p> 
    </div> 
</form> 
<div class="fnote justify"> 
</div> 


    </div> 
    <div id="footer"> 
    </div> 
</div> 


</body> 
</html>

来源

2013-01-02 Alex Parker

你缺少了 “jQuery的倒计时CSS” 参考 – Josep

你应该把$(function() ...)脚本到你的HTML页面的<head>标签。这样，一旦DOM完全加载，倒计时将开始。

来源

2013-01-02 00:33:42 ecbrodie

这没有奏效。 –

我认为问题在于你错过了“jQuery Countdown CSS”的引用。在usage instructions of the plugin它说：

下载并在您的网页的头部分jQuery的倒计时CSS和JavaScript。 @import “jquery.countdown.css”;

但你仍然可以把它没有“jQuery的倒计时CSS”的工作，如果你从id为“倒计时”的<h4>元素去掉class属性，像这样：

<div class="time_box"> 
    <h3 class="italic">When The Clock Hits Zero ... </h3> 
    <h4 id="countdown">14min 20sec </h4> 
</div>

JSFiddle Example

来源

2013-01-02 01:25:46 Josep

倒计时插件使用类hasCountdown来测试倒计时是否已经实例化，所以你应该使用不同的类名。

从jquery.countdown.js：

/* Class name added to elements to indicate already configured with countdown.*/ 
markerClassName: 'hasCountdown'

来源

2013-01-02 01:41:01 VLS

倒计时脚本未开始倒计时

回答

相关问题