我正在设置一个计时器，但我做错了。 所以请给我更好的方法来做到这一点

Question

我正在设置一个计时器，但我做错了。 所以请任何人给我更好的方法来做到这一点。

这是我写的代码....我知道我已经以错误的方式完成了它，但它的工作。 我设置计时器40秒。

<!DOCTYPE html>

<html><head><title>Online</title>
<script language="javascript">


function timedText()
{

var x=document.getElementById('txt');

var t40=setTimeout(function(){x.value="40 sec "},1000);
var t39=setTimeout(function(){x.value="39 sec "},2000);
var t38=setTimeout(function(){x.value="38 sec "},3000);
var t37=setTimeout(function(){x.value="37 sec "},4000);
var t36=setTimeout(function(){x.value="36 sec "},5000);
var t35=setTimeout(function(){x.value="35 sec "},6000);
var t34=setTimeout(function(){x.value="34 sec "},7000);
var t33=setTimeout(function(){x.value="33 sec "},8000);
var t32=setTimeout(function(){x.value="32 sec "},9000);
var t31=setTimeout(function(){x.value="31 sec "},10000);
var t30=setTimeout(function(){x.value="30 sec "},11000);

var t29=setTimeout(function(){x.value="29 sec "},12000);
var t28=setTimeout(function(){x.value="28 sec "},13000);
var t27=setTimeout(function(){x.value="27 sec "},14000);
var t26=setTimeout(function(){x.value="26 sec "},15000);
var t25=setTimeout(function(){x.value="25 sec "},16000);
var t24=setTimeout(function(){x.value="24 sec "},17000);
var t23=setTimeout(function(){x.value="23 sec "},18000);
var t22=setTimeout(function(){x.value="22 sec "},19000);
var t21=setTimeout(function(){x.value="21 sec "},20000);
var t20=setTimeout(function(){x.value="20 sec "},21000);

var t19=setTimeout(function(){x.value="19 sec "},22000);
var t18=setTimeout(function(){x.value="18 sec "},23000);
var t17=setTimeout(function(){x.value="17 sec "},24000);
var t16=setTimeout(function(){x.value="16 sec "},25000);
var t15=setTimeout(function(){x.value="15 sec "},26000);
var t14=setTimeout(function(){x.value="14 sec "},27000);
var t13=setTimeout(function(){x.value="13 sec "},28000);
var t12=setTimeout(function(){x.value="12 sec "},29000);
var t11=setTimeout(function(){x.value="11 sec "},30000);
var t10=setTimeout(function(){x.value="10 sec "},31000);

var t9=setTimeout(function(){x.value="9 sec "},32000);
var t8=setTimeout(function(){x.value="8 sec "},33000);
var t7=setTimeout(function(){x.value="7 sec "},34000);
var t6=setTimeout(function(){x.value="6 sec "},35000);
var t5=setTimeout(function(){x.value="5 sec "},36000);
var t4=setTimeout(function(){x.value="4 sec "},37000);
var t3=setTimeout(function(){x.value="3 sec "},38000);
var t2=setTimeout(function(){x.value="2 sec "},39000);
var t01=setTimeout(function(){x.value="1 sec "},40000);
var t0=setTimeout(function(){x.value="0 sec "},41000);

var wc=setTimeout(function()
    {
    document.quest.submit();
    window.open('best2.php?username=$username');
    window.close('best1.php?username=$username');
    },42000);

}


</script>


</head>
<body onload="timedText()">

<br><br>
<form name="quest" method="POST" action="">

<p align='right'><b>Time left to answer this Question : </b>

<input type="text" id="txt" /></p>

<p><b>Question 1 : </b> Vanessa and Brett had been arguing about their perceived 
proclivity to spend for hours together. What word describes the couple's predicament? <br></p>

  <p><input type="radio" value="Wrong" name="ans" id="r1">Demarche </p>
  <p><input type="radio" value="Correct" name="ans" id="r2">Impasse </p>

  <p><input type="radio" value="Wrong" name="ans" id="r3">Mélange </p>
  <p><input type="radio" value="Wrong" name="ans" id="r4">tête-à-tête </p>

<input type="submit" name="NEXT" value="Next" >
<br/>
<br/>
</form>
</body>
</html>

Answer 1

这将是更好的设置方式：

var interval = setInterval(function() { /*doSomething*/ }, 1000)
setTimeout(function() { clearInterval(interval); }, 40000);

Answer 2

使用setInterval而不是setTimeout然后你可以计算：

var timer = 0;
var t = setInterval(function() {
    timer++;
    if (timer == 1) {
        x.value = "1 sec";
    } else if (timer == 2) {
        x.value = "2 sec";
    }  //...and so on
}, 1000)

Answer 3

你可以使用for循环来做到这一点：

for(var i=0;i<40;i++){

var t+""+i=setTimeout(function(){x.value=i+" sec "},(i+1)*1000);

}

Answer 4

使用从40到0的值。

var timeLeft = 41;
function timedText() {
    var x = document.getElementById("txt");
    window.setInterval(function() {
        timeLeft--;
        x.value = timeLeft + " sec";

        // Submit the form if the counter reaches zero
        if (timeLeft == 0) {
            document.quest.submit();
            window.open('best2.php?username=$username');
            window.close('best1.php?username=$username');
        }
    }, 1000);
}

Answer 5

看起来你想要制作一个倒数计时器。 这是一种方式：

var startTime = 40;
var txt = document.getElementById("txt");

var timer = setInterval(function(){
    if(startTime == 0){
       txt.value = "Times up";
       clearInterval(timer);
       return;
    }
   txt.value = startTime-- + " sec";
}, 1000);

JS小提琴： http ： //jsfiddle.net/z3TBM/