Heim > Artikel > Web-Frontend > Optimieren Sie die Benutzererfahrung beim Warten auf die Ladedatenliste des Ajax-Anforderungsservers
Dieses Mal werde ich Ihnen die Benutzererfahrung bei der Optimierung des Ajax-Anfrageservers zum Laden der Datenliste vorstellen und warten Werfen wir einen Blick darauf. Wir verwenden weui.loading in weui.js als Effekt, die
beforeSend- und Complete-Methoden von Ajax, um einen Ladevorgang durchzuführen, der beim Laden von Daten einige Sekunden dauert...
JS-Datei, die auf die Seite geladen werden soll:
Sie können es aus der Dokumentation von weui herunterladen. Dies ist die Demo:
https://weui.io/weui.js/ Hier Wir sprechen hauptsächlich über
jQueryajax get. Wenn Daten abfragt, ist seine Struktur:
Ich glaube, Sie haben die Methode beherrscht, nachdem Sie den Fall hier gelesen haben Artikel und mehr Wie aufregend, achten Sie bitte auf andere verwandte Artikel auf der chinesischen PHP-Website!$.ajax({ type: 'get', url: url, data: data, dataType: 'json', contentType: 'apllication/json; charset=utf-8' , //数据加载前调用的方法 beforeSend() beforeSend: function(data){ //这里判断,如果没有加载数据,会显示loading if(data.readyState == 0){ weui.loading('loading'); } }, //数据加载成功调用的方法 sucess() sucess: function(data){ //这里写数据加载成功后,会执行的代码 }, //数据加载成功后调用的方法 complete() complete: function(data){ //这里判断,数据加载成功之后,loading 隐藏 if(data.status == 200){ setTimeOut(function(){ weui.loading('loading').hide(); },500); } }, //数据加载错误后调用的方法 error() error: function(data){ weui.topTips('数据加载失败!'); } })
Empfohlene Lektüre:
Ajax, um einen Paging-Effekt ohne Aktualisierung zu erzielen Verwenden Sie Ajax, um die Anmeldeseite für Sitzungstimeout-Sprünge zu implementierenDas obige ist der detaillierte Inhalt vonOptimieren Sie die Benutzererfahrung beim Warten auf die Ladedatenliste des Ajax-Anforderungsservers. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!