简单的倒计时方法

最近在做项目的过程中，遇到一个功能需要倒计时的任务，于是通过查找资料和自己研究了一番，写出了一个简单的倒计时方法，下面就来看下吧。

1、先简单布局一下页面，方便看倒计时效果。代码如下图所示：

效果如下图所示：

、

2、接下来就是JS代码了，直接看代码吧，如下图所示：

先是声明出倒计时方法需要用到的变量，这里开始都设置了0分、10秒，下面就可以写倒计时的方法了，代码如下图所示：

可以看见图中代码主要是通过判断执行计时的，当秒等于0的时候，并且分钟不等于0的时候，就给它重新赋值等于60，然后进行自减，如果起始值不等于0，就直接进行自减，然后在判断秒的里面还有判断分钟的，结合起来就是，当秒等于0，分钟不等于0的时候，分钟就执行自减，如果分和秒都等于0的时候，就是倒计时结束了，停止倒计时方法，再弹出一个提示框。

3、上面只是写完了方法，还需要去调用，所以下面就是通过按钮去调用倒计时方法：

代码如下图所示：

效果如下图所示：

上面就是简单的倒计时方法了，看完之后可以发现还是有不足的地方，可以看见在计时的过程中，开始倒计时的按钮还是可用状态，这就是意味着可以不断调用到计时方法，这就让倒计时不准确了，是给很大的问题，所以需要通过代码来将它禁用。也就是再第一次点击开始倒计时后，就立即禁用按钮，然后在倒计时结束的时候，再启用就可以了。代码如下图所示：

只要将这两句代码放在对应的位置就可以了，一个放在按钮的点击事件中，也就是将按钮禁用，还一个就是放在当倒计时结束的时候，也就是将按钮启用了。

以上就是简单的一个倒计时方法，在遇到类似问题的时候可供学习和参考。