A wait effect based on jquery Ajax

Special Note: I blog part of the reference network other blogs, but I have personally written and verified through. If you find that the blog has errors, please prompt to avoid misleading other people, thank you! Welcome reprint, but remember to indicate the source of the article: HTTP://WWW.CNBLOGS.COM/MAO2080/1, effect example 1, loading effect

2. Post-load effect

2. Sample Code

1 varAjaxutil = {2             /** To ensure that the load icon does not flash past, requests less than 600 milliseconds will be delayed loading*/3Loadshowtime: -,4             /**5 * Ajax Request6 * URL requested by @param {Object} URL7 * @param {Object} params parameter (JSON type, such as: {userName: ' admin ', email: ' [email protected] '})8 * @param {Object} successcallback Custom Function-returns when successful9 * @param {Object} errorcallback Custom Function-returned on failureTen * @param {Object} args other parameter {"Loadingid": null} One              */ AAjaxrequest:function (URL,params, Successcallback, Errorcallback, args) { -args =ajaxutil.showloading (args); - $.ajax ({ the Url:url, -Dataparams, -Type"Get", -DataType:"JSON", +                     Async:true, - Success:function (res) { +                         if(Res.success | | res.code = = $){ AArgs.timestamp =NewDate (). GetTime ()-Args.timestamp; at                             if(Args.timestamp | | args.timestamp >ajaxutil.loadshowtime) { - window.settimeout (function () { - ajaxutil.hideloading (args); - Successcallback (res); -}, ajaxutil.loadshowtime-args.timestamp); -}Else{ in ajaxutil.hideloading (args); - Successcallback (res); to                             } +}Else{ -Ajaxutil.hideloading (args,true); the                             if(errorcallback) { * Errorcallback (res); $                             }Panax Notoginseng                         } -                     }, the Error:function (res) { + ajaxutil.hideloading (args); AAlert"Request failed ..."); the                     }, +                 }); -             }, $             /** $ * Display loading loading - * @param {Object} args -              */ the showloading:function (args) { -args =!args?{}:args;WuyiArgs.timestamp =NewDate (). GetTime (); the                 if(args.loadingid) { -                     varcontainer =$ (args.loadingid); Wu                     if(container) { -Container.css ({"position":"relative"}); AboutContainer.append ('<div class= "Loading" style= "width:60px; height:24px; position:absolute;left:50%;top:50%;margin-left:-30px; margin-top:-12px; " ></div>'); $                     } -                 } -                 returnargs; -             }, A             /** + * Hide Load loading the * @param {Object} args -              */ $ hideloading:function (args) { the                 if(args.loadingid) { the                     varcontainer =$ (args.loadingid); the                     if(container) { theContainer.find ('. Loading'). Remove (); -                     } in                 } the             } the         } About          the $ (function () { theAjaxutil.ajaxrequest ("Data.json",NULL, Function (res) { the                 //Processing Request succeeded +$("#userName"). HTML (res.data.userName); -$("#email"). HTML (res.data.email); the }, function (res) {Bayi                 //Processing request failed the}, {loadingid:"#test1"}) the});

3. Download Information

Load-demo.rar

A wait effect based on jquery Ajax