Ajax image loading, complete

Source: Internet
Author: User

In order to give users a better experience, our predecessors developed Ajax,

So how can we use ajax to give users the best experience,

Well, let's get started. This article is about how to give users a good feedback after Ajax is submitted. If the user does not respond after half a day, our program is already being executed. This will give a bad impression. If we give him some feedback, the effect will be different, obviously better. For example!

So what if such an image is loaded when Ajax is running? Of course there are many methods. I should paste the code.

Ajaxload. textload = function () {// text message $ ('. waiting '). show (); // here is a GIF loading image that I prepared in advance. The initial display is set to none. When I started running Ajax, I showed this image, the above var id = $ ('. grouplist Li. active '). ATTR ('id'); var content =$ ("# Content "). val (); $. ajax ({type: 'post', URL: 'group _ data. do ', datatype: 'json ',
Timeout: 5000, data: {"type": "sendtext", "group_id": ID, "content": Content}, success: function (data) {$ ('. waiting '). hide (); Data = JSON. parse (data ['result'] ['data']); If (data ['errcode'] = 45009) {$. confirm ({HTML: "You have reached the upper limit for sending Group messages this month! ", Buttons: {" OK ": function () {return ;}});} else if (data ['errcode'] = 1) {$. confirm ({HTML: "developed failed! ", Buttons: {" OK ": function () {return ;}});} else if (data ['errcode'] = 1) {$. confirm ({HTML: "developed successfully! ", Buttons: {" OK ": function () {return ;}}); loadtextmateriallistl () ;}}, complete: function (xhr, status) {// error callback is not used here. Why? Because we use complete, the callback function after the request is complete (called after the request is successful or fails ). $ ('. Waiting '). hide (); // when Ajax enters the complete callback, we can load the image hide just added. If (status = 'timeout ') {// if the request is equal to the set timeout time, execute the following code! $. Confirm ({HTML: "The request times out. Please try again later! "+ Status, buttons: {" OK ": function () {return ;}});} else if (status = 'error') {$. confirm ({HTML: "request error! "+ Status, buttons: {" OK ": function () {return ;}}});}}})};

Well, it's actually that simple. What are you waiting for? Try it yourself.

Ajax image loading, complete

Related Article

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.