倒計時腳本未開始倒計時

有人可以告訴我爲什麼倒計時功能無法正常工作（倒數計時不是以倒數第一次倒數開始）。可能真的很簡單，但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

倒計時腳本未開始倒計時

回答

相關問題