1

我有这个足球计数脚本

// Class: Timer
var Timer = function (callback) {
    // Property: Frequency of elapse event of the timer in milliseconds
    this.Interval = 1000;

    // Property: Whether the timer is enable or not
    this.Enable = new Boolean(false);

    // Event: Timer tick
    this.Tick = callback;

    // Member variable: Hold interval id of the timer
    var timerId = 0;

    // Member variable: Hold instance of this class
    var thisObject;

    // Function: Start the timer
    this.Start = function () {
        this.Enable = new Boolean(true);

        thisObject = this;
        if (thisObject.Enable) {
            thisObject.timerId = setInterval(
            function () {
                thisObject.Tick();
            }, thisObject.Interval);
        }
    };

    // Function: Stops the timer
    this.Stop = function () {
        thisObject.Enable = new Boolean(false);
        clearInterval(thisObject.timerId);
    };

};

// Namespace: Match rules and timings
var Match = {

    Timers: {
        FirstHalf: new Timer(TimerTick),
        HalfTime: new Timer(TimerTick),
        SecondHalf: new Timer(TimerTick),
        TickCount: -1
    },

    Strings: {
        FirstHalf: 'First Half',
        HalfTime: 'Half Time',
        SecondHalf: 'Second Half',
        FullTime: 'Finished'
    },

    DisplayTime: function (t) {
        var m = parseInt(t / 60);
        var s = t % 60;
        return (m < 10 ? '0' + m : m) + ":" + (s < 10 ? '0' + s : s);
    }
};

// Function: Tick Event Handler (callback function)
function TimerTick(timer) {

    // Document elements used.
    var TimerP = document.getElementById('time');
    var DisplayP = document.getElementById('display'); 

    // During First Half
    if (Match.Timers.FirstHalf.Enable == true) {
        if (Match.Timers.TickCount == -1) { Match.Timers.TickCount = 0 }
        if (Match.Timers.TickCount == 2700) {
            Match.Timers.FirstHalf.Stop();
            Match.Timers.TickCount = -1;
            Match.Timers.HalfTime.Start();
        } else {
            TimerP.innerHTML = Match.DisplayTime(Match.Timers.TickCount);
            DisplayP.innerHTML = Match.Strings.FirstHalf;
            Match.Timers.TickCount++;
        }
    }

    // During Half Time
    else if (Match.Timers.HalfTime.Enable == true) {
        if (Match.Timers.TickCount == -1) { Match.Timers.TickCount = 0 }
        if (Match.Timers.TickCount == 900) {
            Match.Timers.HalfTime.Stop();
            Match.Timers.TickCount = -1;
            Match.Timers.SecondHalf.Start();
        } else {
            TimerP.innerHTML = '45:00';
            DisplayP.innerHTML = Match.Strings.HalfTime + ' (' + Match.DisplayTime(900 - Match.Timers.TickCount) + ')';
            Match.Timers.TickCount++;
        }
    }

    // During Second Half
    else if (Match.Timers.SecondHalf.Enable == true) {
        if (Match.Timers.TickCount == -1) { Match.Timers.TickCount = 2700 }
        if (Match.Timers.TickCount == 5400) {
            TimerP.innerHTML = '90:00';
            DisplayP.innerHTML = Match.Strings.FullTime;
            Match.Timers.SecondHalf.Stop();
            Match.Timers.TickCount = -1;
        } else {
            TimerP.innerHTML = Match.DisplayTime(Match.Timers.TickCount);
            DisplayP.innerHTML = Match.Strings.SecondHalf;
            Match.Timers.TickCount++;
        }
    }
}

function KickOff() {
    var btn = document.getElementById('btnKickOff');
    btn.setAttribute('style','display: none;');
    Match.Timers.FirstHalf.Start();
}  

或在这里查看http://pastebin.com/CkmPQ9ZV

我有这个脚本的 HTML 代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
        <title>Simple Football Match Timer</title>
        <script src="timer.js" type="text/javascript"></script>
    </head>

    <body>
        <form id="pageForm" runat="server">
            <div>    
                <p id="display">Waiting for kick off.</p>
                <p id="time">00:00</p>
                <input id="btnKickOff" type="button" value="Kick Off!" onclick="KickOff();" />
            </div>
        </form>
    </body>
</html>

当我单击启动时,此脚本开始计数。它从 0 到 45 分钟开始计数,之后它显示中场休息时间,倒计时 15 分钟在 15 分钟结束后休息,它从 45 到 90 再次开始计数,当它达到 90 时,它显示“完成"

它的脚本很好,但我的问题是我希望这个脚本在每次刷新页面后不要重新开始我想将它发布在我的网站上,这样当用户打开我的网站时,他们将能够看到比赛的时间......我会点击它在比赛开始时..它一直持续到结束

PS:我不擅长 Javascript.. 我在创建这个脚本时得到了帮助 :)

4

2 回答 2

2

如果您希望每个人在访问您的站点时看到相同的内容,即相同的比赛时间,您不能像这样使用 JavaScript。JavaScript 在您用户的计算机上运行,​​因此当您启动计时器时,只有您会看到它。

除非您在服务器上存储 JavaScript 可以访问的开始时间以找出匹配的距离,否则这很难做到。就个人而言,我会使用 MySQL 创建一个数据库表,并将所有匹配项及其开始时间存储在其中。然后,您可以使用 PHP 访问它,然后调用 httprequest 将其转换为 JavaScript。但是,可能有更简单的方法可以做到这一点。

于 2012-05-26T08:13:57.863 回答
0

您可能可以设置一个特定的 unix 时间来启动它,然后让它引用该变量而不是“timerId”变量。

于 2012-05-26T07:58:10.467 回答