The loading wait effect before Ajax returns data, ajaxloading

The loading wait effect before Ajax returns data, ajaxloading

Pie Chart

Click the event on the page.(<A sceneid = "@ scene. ID "href =" javascript: void (0) "rel =" external nofollow "onclick =" build (this) "> Generate </a>)

Call the following method:

Function build (sender) {var jqSender =$ (sender); var sceneid = jqSender. attr ('sceneid'); $. ajax ({type: 'post', url: "Follow/UpdateUrl", data: {sceneid: sceneid}, beforeSend: function () {jqSender. hide (). after ('') ;}, success: function (data) {// obtain the td tag $ ('tbody tr [id = '+ sceneid +'] td.wxurl-col'}.html (data. QRUrl); $ ('tbody tr [id = '+ sceneid +'] td.localkey-col').html (data. localKey); // hide the generate button and insert the image var localkey = data. localKey; jqSender. after ('');}, complete: function () {$ ('# load '). remove ();}});}

The background page will not be written. The url is configured with the path passed to the background. The most important thing is

beforeSend: function () { jqSender.hide().after(''); },

This should take into account the characteristics of ajax asynchronous requests. When ajax is executed to a url, a thread will jump to the background for execution,

The browser will add a thread (I don't know if the mark is not standard) to continue executing the subsequent programsuccess: function (data)Pause the returned data waiting for the background to be successful

In this way, the inserted image in before is equivalent to a loading. After the data is successfully returned, remove the image in before and write it in the complete: function () statement.

The background processing process is like this: first, an http GET request gets the access_token of the public platform, and then uses the http POST request to obtain the ticket in exchange for the QR code.

Then, use the WebClient method to download the requested QR code to the local storage, and then add, query, modify, and display the QR code on the web page.

In such a large segment, loading has enough time to display it. If the time is short, you can check whether a time has been defined on the Internet, so that loading can be fully displayed, so as not to be abrupt.

Summary

The above section describes the loading wait effect before Ajax returns data. I hope it will help you. If you have any questions, please leave a message and I will reply to you in a timely manner. Thank you very much for your support for the help House website!