zoukankan      html  css  js  c++  java
  • 倒计时完成之后执行alert语句

    现实倒计时完成之后执行alert语句

      本来直接在判断里写了alert语句,后来发现当执行的一秒的时候就会执行,然后点击关闭之后才会变成0秒。然后改成如下这样

      需要了解两点:

      1.  修改innerHTML和页面渲染的问题

         虽然代码是自上而下执行,但是js是单线程的,只有所有代码执行完毕之后,有空闲才会渲染页面。DOM修改是同步的,但是页面的渲染要等主线程空闲;

      2.  定时器的工作机制

         定时器对队列的工作方式是,当特定时间过去后将代码插入。注意,给队列添加代码并不意味着对它立刻执行,而只能表示它会尽快执行;

      结构:     <div class="countDown">倒计时:03分00秒</div>

      js:

      

      <script> 

        var time = 1800                 //    设置成秒

        var timer = setInterval(function(){

          time = time-1;

          var minute = parseInt(time/60);

          if(minute <= 9){

            minute = "0" + minute;

          }    

          var second = parseInt(time%60);

          if(second <= 9){

            second = "0" + second;

          }

          coundDown.innerHTML = "倒计时:"+minute+"分"+second+"秒";

          if(minute == 0 && second == 0){

            setTimeout(function(){

              alert("倒计时结束");

            },0)

            clearInterval(timer);

          }

        },1000)

      </script>

  • 相关阅读:
    没人关注的角落是个好地方
    PICKIT3 WIN10 无法连接问题解决
    TM1650+msp430单片机 调试及遇到问题的总结
    即将会来日常更新stm32的学习过程
    Learn Arduino the hard way 1——点亮一个LED
    准备再次开始更新
    Tcl之Read files for synthesis
    Verilog之event
    Tcl之Math
    Digital design之Boolean Algebra
  • 原文地址:https://www.cnblogs.com/ly-qingqiu/p/10209939.html
Copyright © 2011-2022 走看看