JS settimeout Delay Loading

Source: Internet
Author: User

Delay Automatic Completion
Requirements: In the text input box, listening for user input, to achieve the function of automatic completion.
Disadvantages: Each user input a character, will produce an AJAX request, if the user entered a long string of content, the number of requests are many, in fact, the last time, is the user needs.
The code is similar to the example above.

Deferred scrolling
Requirements: page ads, users need to scroll to where to follow.
Disadvantage: User scrolling at the bottom, triggering the N times to let the ads reposition function. In fact, only when the user stops, only the trigger once is enough.
The code is similar to 1.

var changetab = function () {
var Timeid = 0;
return function (tabid) {
if (Timeid) {
Cleartimeout (Timeid);
Timeid=0;
}
settimeout (function () {
Ajax do Something
},500);
};
}();

Look at a complete example

<%@ page language= "C #" autoeventwireup= "true" codebehind= "settimeout.asp tutorial X.cs" inherits= "web effects. settimeout"%>
<!doctype HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/ Xhtml1-transitional.dtd ">
<title></title>
<style type= "Text/css Tutorial" >
#flyout
{
Border:solid 2px Gray;
Background-color: #fff999;
width:300px;
height:100px;
Display:none;
}
</style>
<script type= "Text/javascript" >
var Flyouttimer;
function Mouseo Tutorial utevent () {
Hide flyout after 1 second then the mouse move out of the flyout zone
Flyouttimer = settimeout (hideflyout, 1000);
}
function Mouseoverevent () {
Clear the timer when the mouse move over the flyout
Cleartimeout (Flyouttimer);
}
function Hideflyout () {
document.getElementById ("flyout"). Style.display = "None";
}
function Showflyout () {
document.getElementById ("flyout"). Style.display = "block";
Mouseoutevent ();
}
</script>
<body>
<form id= "Form1" runat= "Server" >
<div onclick= "showflyout ()" >
Click me to show flyout</div>
<div id= "flyout" onmouseout= "mouseoutevent ()" onmouseover= "Mouseoverevent ()" >
This is a flyout
</div>
</form>
</body>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.