如何在Javascript中制作一个非常简单的倒数计时器?

时间:2016-12-30 12:29:34

标签: javascript loops if-statement timer logic

我正在制作一个生成随机数的简单游戏,用户必须输入一个值,如果用户值与生成的随机值匹配,则用户基本上赢了这是一个初学者项目。我想制作一个小型计数器,以便用户只有有限的时间来输入值,我希望在标签的屏幕上显示有限的时间。假设您必须将该值设置在30秒以下,并且计时器将每秒从1到30计数。从1到30的计数将每秒在标签中更新。这是我现在正在尝试的逻辑,我无法想出任何其他方式...如果我在代码中做了一些错误请评论或如果你有更简单的方法请在下面发布。 (请不要因为帐户暂停威胁而拒绝投票) 这是我的计时器代码的一部分:

if(timer <= 30)
    {
        for(var i = 0;i >= 30;i++)
        {
            setInterval(null,1000);
            timer++;
            document.getElementById("counter").innerHTML = timer+" seconds wasted";
        }
        alert("Time is over, you lost by "+s);
    }

2 个答案:

答案 0 :(得分:0)

setInterval函数有2个参数,一个回调(触发的​​javascript中的一个anomynous函数)和每个触发间隔之间的毫秒数。

你在脚本中做的是创建一个每秒无关的间隔(这是无限运行),然后递增计时器整数并更新DOM。但是,这一切都在几秒钟内完成。

我建议(在使用函数之前),查看文档以了解如何改进脚本以按照您的意图工作;-)以下是一些可能有助于您入门的链接:

http://www.w3schools.com/js/js_timing.asp https://www.sitepoint.com/build-javascript-countdown-timer-no-dependencies/

我不会为你做这项工作,因为对初学程序员来说这是一个很好的练习; - )

如果您无法弄清楚,请在此答案下面留下评论,如果您需要进一步帮助,我们会尽快给您帮助。

答案 1 :(得分:0)

您可以创建递归函数。 说var countDown function(){ time = time--; setTimeout(countDown, 1000);}

然后你需要一个可以访问countDown函数的变量时间。 var time = 30;

在countDown函数中,您可以创建updateTimeElement。

试一试。