Setinterval and setTimeout call methods and browser cache Problems
In JS, setinterval and setTimeout can be used as timers. As you all know,
There are also many articles on the Internet about the differences between the two methods.
Here I also want to talk about two questions:
1. Write the call method.
For example:
Function showcallinandout (){
// Xxx
}
// SetTimeout ("showcallinandout ()", 1000 );
// SetTimeout (showcallinandout, 1000 );
The above two call methods are correct !!!
If the first parameter is a string, the method name must be in parentheses;
If the first parameter is a variable, write the variable name (method name) without parentheses.
The following example shows how to call a parameter:
<HTML>
2. about the problem of timer calling in Ajax (send requests at each time ).
If we want to refresh a value on the page and constantly refresh it from time to time, everyone will think
The JS timer is used to continuously send Ajax requests, and the value on the callback function CMB page changes this idea.
In actual projects, I encountered a problem:
I use setinterval to regularly call a method showcallinandout (),
This method is Ajax. The strange thing is that sometimes regular refresh is normal, which is consistent with my initial idea,
Sometimes, timed refresh does not work. I place a breakpoint in the background, and the output print does not respond.
At first I thought it was a problem with setinterval, so I added a row of counting in this method:
$ ("# Inter"). Val ("showcallinandout call" + AAA + "times ");
AAA ++;
I remember that the AAA on the page is always changing, that is, setinterval is always normal!
The problem can only be caused by the showcallinandout () method!
This method is Ajax, nothing special, but it is not called. I even add a button on the page.
Directly calling showcallinandout () does not respond.Later, I called showcallinandout () during page initialization to refresh a value on the page.
Then call setinterval. Of course, showcallinandout () is still called in setinterval ().
When I tested it again, I found that the page will be called during initialization, but it is not called in setinterval! When I change
Database Value, and then refresh the page, neither of which is called!The URL is absolutely correct. Why not call it? So I suddenly thought of browser cache!
Therefore, I add a random parameter to the URL. No random parameters are added to the method for page initialization,
Add random parameters to the methods in setinterval.
Result:
2-1: Enter the page for the first time:
Page Initialization is called, and setinterval is also called.
2-2. When I change the Database Value and refresh the page:
Page initialization will not be called, and setinterval will be called!
The page displays the previous value first! After a few seconds, the actual database value will be displayed!
The result is obvious. The js method will certainly be called, but the Ajax request may not always go!
Why? Browser cache!The requested URL in Ajax will be cached in the browser! If the browser finds that new requests are exactly the same as previous requests,
The browser took out the results in the cache directly, and the request would leave. This is not a new problem. I used
This is also the first time that a user uploads an image during Image Upload. before clicking submit, he wants to change the image name (
), I changed the image name to the user name in the background, so that the image URL is always the same, even if the uploaded
Image, the previous one is displayed on the page! Adding random parameters to the URL will be fine. In the final analysis
Browser cache problems. He thinks that your request or URL is the same as the previous one, and he takes the result directly! The same is true for Ajax!
Just like the 2-2 I did this time, the reason why the previous value (the database has changed the value) is displayed on the page, and then
I have added random parameters to the setinterval request, and the result is displayed correctly. The background code can also be used. This is very clear.
The URL initialized by the page has been cached in the browser. When you refresh the page, Ajax does not go through this method and is directly retrieved from the cache;
The following setinterval request URL has a random parameter that makes the URL different each time. The browser can only resend the request to obtain the value.
The actual value of the database is correct.As for the reason why setinterval can be used normally without adding random parameters, the reason is:
The browser does not cache normally. If it is abnormal, It is cached.
Under what circumstances will the browser leave a cache? This buddy is not clear.
It is best to add random variables to URLs and requests on the page, which effectively avoids some "weird" problems.
Good coding habits.As for random parameters, let me also talk about them here.
In fact, it is very easy to add a parameter to the URL.
For example:
"XXXXX/Voice/getcallininfo. Action? Ss = aaa ";
If the SS is random, you can.
In JS, I prefer this:
URL: "<% = PATH %>/Voice/getcallininfo. Action? Ss = "+ math. Random ()In JSP, it is better to use date, random number, and so on to generate an irregular string and add it after the URL.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
