When you use Ajax to get data asynchronously in a project, sometimes the page always appears blank because of data problems or network problems, and now it is used to load pictures to transition this state:
<script> $ (function () {$.ajax ({URL: ',///provide interface file address link dataType: ' JSON ', type: ' POST ', Beforesend:function () {$ (' #loading '). HTML ("<p style=\" color: #999; font-size:14px\ "> Load, please ......</p> later")//Send the picture before the data is sent
Error:function (msg) {//Data read failure display Znodes=data.responsejson;
Alert ("Sorry, data acquisition failed, please contact admin"); Success:function (msg) {//Data reads successfully and displays the list of data $ (' #loading '). fadeout (1000);
Picture display time; var ul = ""; for (var i= 0;i<msg.legth;i++) {//Data list row number ul = "<li class= ' list ' ><a href= ' php/phparticle.php?art=" +ms g[i][' id ']+ ' class= ' widget-list-link ' > ' + msg[i][' title ']+ ' <i class= ' more-mark ' > ' + ' >> ' + ' </i>
</a></li> ";
$ ("#list"). HTML (UL);
Error:function () {////Console.log ("link Error") is displayed when failure occurs;
}
});
}); </script>
Data is displayed in load state
The above is a small set to introduce the use of loading pictures to solve in the AJAX data loading page of the short blank problem (recommended), I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!