4

ページを更新してもカウントダウンタイマーをリセットしないタイマーのコードが必要です。

keith wood plug inでサンプル コードを見ましたが、これをhtml ファイルに実装する方法がわかりません。 ここにリンクがあります:

http://keith-wood.name/countdown.html

誰かが私を助けてくれることを願っています!ありがとう!:)

表示するには、時、分、秒が必要です。指定された時間の後に、 「Time is up!」と表示されるプロンプト ボックスがあります。これは、開発中のオンライン試験用です。どうもありがとうございます!:)

4

3 に答える 3

0
  1. ページの head セクションに jQuery ライブラリを含めます。
  2. jQuery Countdown CSS と JavaScript をダウンロードして、ページの head セクションに含めます。または、最小化されたバージョンの jquery.countdown.min.js (13.5K 対 31.4K、圧縮された場合は 4.4K) を使用できます。
  3. カウントダウン機能を div に接続します。

したがって、最終的なコードは次のようになります。

<html>
<head>
    <title>jQuery Countdown</title>
    <style type="text/css">@import "jquery.countdown.css";</style>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
    <script type="text/javascript" src="jquery.countdown.js"></script>
    <script type="text/javascript">
        $(function () {
        var year = new Date();
        year = new Date(year.getFullYear(), 11 - 1, 20);
        $('#dvCountDown').countdown({until: year, format: 'HMS'});
            $('#year').text(austDay.getFullYear());
        });
    </script>
</head>
<body>
<h1>jQuery Countdown Basics</h1>
<p>Counting down to 20 November <span id="year">2012</span>.</p>
<div id="dvCountDown"></div>

</body>
</html>

お役に立てれば!

于 2012-11-16T09:24:28.320 に答える
0

If you want to use that script then you'll have to count by date and not a custom countdown value in order for it not to get reset on page refresh: http://jsfiddle.net/qWERa/1/

//Custom countdown value starting on page load
$('#CountdownbyValue').countdown({until: '+0h +0m +8s', format: 'HMS',onExpiry: liftOff,});

//Countdown by Date
$('#CountdownbyDate').countdown({until: new Date(2012, 11-1, 17, 10, 10, 10), format: 'HMS',onExpiry: liftOff,});

//Time is up dialog!
function liftOff() {
    alert('Time is up!');
}

Full Code:

<html>
<head>
<title>Demo</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script> 
<script type='text/javascript' src='http://keith-wood.name/js/jquery.countdown.js'></script>
<link rel="stylesheet" type="text/css" href="http://keith-wood.name/css/jquery.countdown.css">
<script type='text/javascript'> 
$(window).load(function(){
//Starts from time of page load
$('#CountdownbyValue').countdown({until: '+0h +0m +8s', format: 'HMS',onExpiry: liftOff,});

//Counts by Date
$('#CountdownbyDate').countdown({until: new Date(2012, 11-1, 17, 10, 10, 10), format: 'HMS',onExpiry: liftOff,});

//Time is up!
function liftOff() { 
    alert('Time is up!'); 
} 
});
</script>
</head>
<body>
<div id="CountdownbyValue"></div>
<div id="CountdownbyDate"></div>
</body>
</html>

Your can also try:

window.onbeforeunload = function() {
    return "Are you sure you want to quit this exam?";
}

I suggest you take a look at this Countdown timer with cookies

于 2012-11-16T09:32:35.440 に答える