In javascritp, there are two special functions for timers, namely:
1. Countdown timer: timename=setTimeout("function();",delaytime);
2. Loop timer: timename=setInterval("function();",delaytime);
The first parameter "function()" is the action to be executed when the timer triggers. It can be a function or several functions, and the functions can be separated by ";". For example, if two warning windows are popped up, you can change "function();" to
"alert('first warning window!');alert('second warning window!');" and the second parameter "delaytime" is the interval time, in milliseconds, that is, fill in "5000", which means 5 seconds.
The countdown timer triggers an event after the specified time arrives, while the loop timer triggers an event repeatedly when the interval time arrives. The difference between the two is that the former only acts once, while the latter acts constantly.
For example, after you open a page and want to automatically jump to another page within a few seconds, you need to use the countdown timer "setTimeout("function();",delaytime)", and if you want to set a sentence to appear one by one,
Then you need to use the loop timer "setInterval("function();",delaytime)".
Get the focus of the form, and then use it. Use if to determine whether the ID and form are the same.
For example: if ("mid" == ) {alert();}, "mid" is the ID corresponding to the form.
Timer:
Used to specify that a program is executed after a specific period of time.
Timed execution in JS, the difference between setTimeout and setInterval, and the l-release method
setTimeout(Expression,DelayTime), after DelayTime, Expression will be performed, setTimeout will be used for a delay of a period of time before performing a certain operation.
setTimeout("function",time) Sets a timeout object
setInterval(expression, delayTime), each DelayTime, will execute Expression. It can often be used to refresh expressions.
setInterval("function",time) Sets a timeout object
SetInterval is automatic repeating, setTimeout will not be repeated.
clearTimeout(Object) Clear the setTimeout object that has been set
clearInterval(Object) Clear the setInterval object that has been set
Let me give you two examples.
Example 1. When a form is triggered or loaded, output string verbatim
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Unt titled document</title>
<script language="JavaScript" type="text/javascript">
var str = "This is a sample text for testing";
var seq = 0;
var second=1000; //The interval time is 1 second
function scroll() {
msg = (0, seq+1);
document.getElementByIdx_x_x('word').innerHTML = msg;
seq++;
if (seq >= ) seq = 0;
}
</script>
</head>
<body onload="setInterval('scroll()',second)">
<div ></div><br/><br/>
</body>
</html>
Example 2. When the focus is in the input box, check the input box information regularly, and do not perform the checking action when the focus is not present.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:///TR/xhtml1/DTD/">
<html xmlns="http:///1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Unt titled document</title>
<script language="JavaScript" type="text/javascript">
var second=5000; //The interval time is 5 seconds
var c=0;
function scroll() {
c++;
if ("b" == ) {
var str="Timed check<b> "+c+" </b> time<br/>";
if(document.getElementByIdx_x_x('b').value!=""){
str+="The current content of the input box is the current content is <br/><b> "+document.getElementByIdx_x_x('b').value+"</b>";
}
document.getElementByIdx_x_x('word').innerHTML = str;
}
}
</script>
</head>
<body>
<textarea name="b" style="height:100px; width:300px;" onfocus="setInterval('scroll()',second)"></textarea><br/><br/>
<div ></div><br/><br/>
</body>
</html>
Example 3. The following is the simplest example. A warning window pops up after the timer time arrives.
<html xmlns="http:///1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script language="javascript">
function count() {
document.getElementByIdx_x_x('m').innerHTML="Time has started!";
setTimeout("alert('Ten seconds to arrive!')",10000)
}
</script>
<body>
<div ></div>
<input TYPE="button" value=" timing start" onclick="count()">
</body>
</html>
Example 4: Countdown time jump
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP '' starting page</title>
<span >3</span>
<a href="javascript:countDown"> </a> will automatically jump after seconds...
<meta http-equiv=refresh content=3;url= '/'/>
<!--Store script start-->
<script language="javascript" type="">
function countDown(secs){
=secs;
if(--secs>0)
setTimeout("countDown("+secs+")",1000);
}
countDown(3);
</script>
<!--The script ends->
</head>
Example 6:
<head>
<meta http-equiv="refresh" content="2;url=''">
</head>
Example 7:
<script language="javascript" type="text/javascript">
setTimeout("=''", 2000);
//The following two can be used
//setTimeout("javascript:=''", 2000);
//setTimeout("=''", 2000);
</script>
Example 8:
<span >2</span>
<script language="javascript" type="text/javascript">
var second = document.getElementByIdx_x('totalSecond').innerHTML;
if(isNaN(second)){
//…not a number processing method
}else{
setInterval(function(){
document.getElementByIdx_x('totalSecond').innerHTML = --second;
if (second <= 0) {
= '';
}
}, 1000);
}
</script>
js timer (execute once, repeat execution)
Share a piece of js code, a small example of js timer, divided into a timer that executes once and a timer that repeats execution. For beginners' reference.
1. Timer executed only once
<script>
//Timer runs asynchronously
function hello(){
alert("hello");
}
//Execute method using method name
var t1 = (hello,1000);
var t2 = ("hello()",3000);//Use string execution method
(t1);//Remove the timer
</script>
2. Repeated execution timer
<script>
function hello(){
alert("hello");
}
//Repeat a method
var t1 = (hello,1000);
var t2 = ("hello()",3000);
//How to remove the timer
(t1);
</script>
Remark:
If there are two methods in a page, both are executed after the page is loaded, but in fact they cannot be executed in order, you can refer to the following methods to solve the problem:
You can add a timer to the onload method, set a timer, and then run it after "delaying" for a period of time, which means that you can distinguish the order of page loading and running methods.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:///TR/xhtml1/DTD/">
<html xmlns="http:///1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
var YC = new Object();
function beginYC()
{
var secondsYC = ("txtYCSeconds").value;
try
{
YC = setTimeout("alert('delay"+secondsYC+"secondsSuccess')", secondsYC*1000);
}
catch(e)
{
alert("Please enter the correct number of seconds.");
}
}
function overYC()
{
clearTimeout(YC);
YC=null;
alert("Termination delay was successful.");
}
/***************************↓↓↓ Use of timer↓↓↓↓↓***************************/
var timerDS = new Object();
var timerDDS = new Object();
function beginDS()
{
= "0";
timerDS = setInterval("addOne()",parseInt(("txtIntervalSeconds").value,10)*1000);
}
function goonDS()
{
timerDS = setInterval("addOne()",parseInt(("txtIntervalSeconds").value,10)*1000);
}
function overDS()
{
clearInterval(timerDS);
timerDS=null;
}
function delayDS()
{
overDS();
timerDDS = setTimeout("goonDS()",("txtDDSSeconds").value*1000);
}
function addOne()
{
if(=="10")
{
overDS();
alert("Congratulations, it has been successfully reached 10 seconds");
return;
}
=parseInt(,10)+1;
}
</script>
</head>
<body>
<form runat="server">
<div>
Use of delayers:</div>
<div>
<label title="Delay seconds: "></label>
<input type="text" value="3" />
<input type="button" onclick="javascript:beginYC()" value="start delay" />
<input type="button" onclick="javascript:overYC()" value="termination delay" />
<input type="button" onclick="javascript:alert('good monrning');" value="normal pop-up window" />
</div>
<br />
<div>
Use of timer:</div>
<div>
<div >0</div>
<label title="Second time interval: "></label>
<input type="text" value="1" />
<input type="button" onclick="javascript:beginDS()" value="start timer" />
<input type="button" onclick="javascript:overDS()" value="termination timing" />
<input type="button" onclick="javascript:goonDS()" value="continue timing" />
<label title="Delay seconds: "></label>
<input type="text" value="5" />
<input type="button" onclick="javascript:delayDS()" value="delay timing" />
</div>
</form>
</body>
</html>