This code will cause the page to open for 5 seconds After a few seconds the dialog box "hello" is displayed. The last sentence can also be written as:
Copy code The code is as follows:

window.setTimeout( "hello()",5000);

Readers can appreciate their differences. This property also exists in the window.setInterval method.
If you cancel the delayed execution before the delay period is reached, you can use the window.clearTimeout(timeoutId) method, which receives an id representing a timer. This id is returned by the setTimeout method, for example:
Copy code The code is as follows:

< ;script language="JavaScript" type="text/javascript">

< /script>

In this way, if you want to cancel the display, you only need to click on any part of the page, and the window.clearTimeout method will be executed, causing the timeout operation to be cancelled.
2． window.setInterval method
This method causes a function to be called every fixed time and is a very common method. If you want to cancel scheduled execution, similar to the clearTimeout method, you can call the window.clearInterval method. The clearInterval method also receives a value returned by the setInterval method as a parameter. For example:
Copy code The code is as follows:

//Define a call that is executed repeatedly
var id=window.setInterval("somefunction",10000);
//Cancel scheduled execution
window.clearInterval(id);

The above code is only used to illustrate how Cancel a scheduled execution. In fact, the setInterval method needs to be used on many occasions. Below we will design a stopwatch to introduce the use of the setInterval function: the stopwatch will include two buttons and a text box for displaying the time. When the start button is clicked, the timing starts, and the minimum unit is 0.01 seconds. Clicking the button again will stop the timing, and the text box displays the elapsed time. Another button is used to reset the current time to zero. The implementation code is as follows:
Copy code The code is as follows:




New Document












7.4.3 Pass to timer call Parameters
Whether it is window.setTimeout or window.setInterval, you cannot take parameters when using the function name as the calling handle. In many cases, you must take parameters, so you need to find a way to solve it. For example, for the function hello(_name), it is used to display the welcome message for the user name:




Copy the code

The code is as follows:

var username = "jack";
// Display welcome information according to the username
Function Hello (_name) { Alert ("Hello," _Name); } At this time, it is not feasible to use the following statement to delay the execution of the hello function for 3 seconds:


Copy code


The code is as follows:

window.setTimeout(hello(userName),3000);
This will make the hello function execute immediately and return the value As the call handle is passed to the setTimeout function, the result is not what the program needs. The desired result can be achieved by using the string form: Copy the code

The code is as follows:

window.setTimeout("hello(userName)",3000);
The string here is a piece of JavaScript code, in which userName represents a variable. But this way of writing is not intuitive enough, and in some cases function names must be used. Here is a little trick to call a function with parameters: Copy code

The code is as follows:




A function _hello is defined here, which is used to receive a parameter and return a function without parameters. The parameters of the external function are used inside this function. , thus calling it without using parameters. In the window.setTimeout function, use _hello(userName) to return a function handle without parameters, thus realizing the parameter passing function.
The window object has two main timing methods, namely setTimeout and setInteval. Their syntax is basically the same, but the completed functions are different.
The setTimeout method is a timing program, that is, what to do after a certain time. Pull it down when you're done.
The setInterval method means to perform an operation repeatedly at a certain interval.
Set delay in JS:
Using SetInterval is very similar to setting the delay function setTimeout. setTimeout is used to delay for a period of time before performing an operation.
setTimeout("function",time) sets a timeout object
setInterval("function",time) sets a timeout object
SetInterval is automatically repeated, and setTimeout will not repeat.
clearTimeout(object) clears the setTimeout object
clearInterval(object) clears the setInterval object
If you use setTimeout to implement the setInerval function, you need to call yourself regularly in the executing program. . If you want to clear the counter, you need to call different clearing methods according to the method used:
For example:




Copy the code

The code is as follows :tttt=setTimeout('northsnow()',1000); clearTimeout(tttt);
Or:



Copy code

The code is as follows:tttt=setInterval('northsnow()',1000); clearInteval(tttt) ;
Give an example:



Copy the code

The code is as follows:


Or:



Copy code

The code is as follows:

Related labels：
javascript timer
source：php.cn
Previous article：How to select blocks and change attribute values ​​​​in jquery_jquery Next article：Usage examples and precautions when the selector contains spaces_jquery
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
CSS only method to dynamically modify image src on click without using JavaScript I need to change the src of an image on mouse click using only css like img:active{}
From 2024-04-06 19:25:49
0
1
505
Scatterplot points do not maintain values ​​when zooming in d3.js This is my first time using d3.js, so please bear with me. I implemented it as pure JavaSc...
From 2024-04-06 18:16:26
0
1
403
JavaScript hover events on vendor-specific pseudo-elements I have the following htmlinput tag. $("input[type='range']::-webkit-slider-thumb"...
From 2024-04-06 15:35:24
0
1
274
Submit form without button using Javascript/Jquery I'm trying to submit a form without a button by calling a JavaScript function and executin...
From 2024-04-06 14:54:03
0
2
421
Customize the appearance of Bootstrap accordion headers using the CollapseDisplay class I want to style the card title of a panel with class collapseshow. In this example, it's t...
From 2024-04-06 12:53:11
0
1
376
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！