如何显示最后5秒时，时间跑完

How to show last 5 seconds when timing is running out?

本文关键字：5秒时 时间 最后 何显示 显示      更新时间：2023-09-26

嗨，我正在使用Javascript设置超时来运行某个函数。

如何显示最后10秒的超时时，它是接近结束?

var a = setTimeout('someFunction()', 10000);

它是否能够使用它存储到变量中的值来显示某些东西?

谢谢

我为您创建了一个小演示，

http://jsfiddle.net/praveen_prasad/DYaan/1/

<div id="target" style="display:none">
    target
</div>

var target,
    allotedTimeForWork=100   /*you can change this*/
    ;
var handler = setTimeout(function(){
      if(!target)
      {
          target=document.getElementById('target');
      }
    target.style.display="block";
    startTicker();
}, allotedTimeForWork);
function startTicker()
{
    var counter=10;
    var tickerHandler= window.setInterval(function(){
          if(counter>0)
          {
              //cache target
              target.innerHTML="you have "+counter +" seconds left";
              counter--;
          }
        else
        {
            target.innerHTML="time over";
            clearInterval(tickerHandler);
        }
    },1000);          
}

不可能直接获取Timeout的剩余时间。您可以尝试为每秒钟设置多个Timeout，或者使用另一个变量来存储Timeout开始的时间。

我会使用两个超时

第一个time - 5秒，调用具有第二个超时(5秒)的函数，该函数将显示计时器

看这里:http://jsfiddle.net/VCAnm/

HTML: 

<span id="aaa">10</span>
JavaScript: 

setInterval(function() {
    var elem = document.getElementById('aaa');
    elem.innerHTML = elem.innerHTML - 1;
}, 1000);

设置2个计时器，一个用于超时，另一个用于警告

var warn_time = 5000;
var function_name = 'someFunction()';
var a = setTimeout('warnFunction(function_name, warn_time)', 10000 - warn_time);
function warnFunction(function_name, time) {
  alert('only ' + time + ' seconds left');   //use a div or whatever to display
  var b = setTimeout(function_name, time);
}
相关文章：