Konfiguration der globalen Ajax-Ladebox (Ladeeffekt)

In diesem Artikel werden hauptsächlich relevante Informationen zur Konfiguration der globalen Ajax-Ladebox vorgestellt (Ladeeffekt). Freunde in Not können sich auf

Hintergrunddatenanforderung in Ajax beziehen Während des Vorgangs möchten wir manchmal, dass der Benutzer weiß, dass die Seite noch etwas im Hintergrund tut. Zu diesem Zeitpunkt müssen wir dem Benutzer eine sehr klare Aufforderung geben, die wir den Fortschrittsbalken nennen

Implementierungsprinzip:

Jquery kann Ajax global festlegen, um einen aspektorientierten Effekt ähnlich dem in C# zu erzielen, das heißt, wir können ihn vor Ajax festlegen Senden und nach Abschluss der Übermittlung führen wir eine Reihe von Vorgängen aus, damit wir beim Start von Ajax das Ladefeld anzeigen und nach Abschluss der Ajax-Anfrage das Ladefeld schließen können, wodurch dieser Effekt im Grunde perfekt erzielt wird.

Der Weg, Ajax global für Jquery zu konfigurieren, ist:

$.ajaxSetup({
beforeSend: function () {
//ajax请求之前
},
complete: function () {
//ajax请求完成，不管成功失败
},
error: function () {
//ajax请求失败
}
});

Natürlich können auch die Konfigurationen von beforeSend/complete/error verwendet werden in einem einzigen Ajax. Schreiben Sie es zur Konfiguration in ajaxSetup und stellen Sie es auf die öffentliche Seite.

Zum Schluss präsentieren Sie der Einfachheit halber den Code. Um den Ladeeffekt zu erzielen, müssen wir CSS nicht manuell schreiben. Dies ist schließlich nicht unsere Stärke. Schüler, die dazu in der Lage sind, können den Ladeeffekt selbst schreiben und ihn manuell steuern Anzeigen und Ausblenden. Wenn Sie es direkt kopieren möchten, stellen Sie bitte die Ebene vor: http://layer.layui.com/

Eine Sache, die hier erklärt werden muss, ist, dass es mehrere Ajaxe gibt gleichzeitig kann es sein, dass einer geladen wird und die anderen verloren gehen. Dafür fallen mir die folgenden zwei Lösungen ein:

■ Meine aktuelle Lösung besteht darin, ihn mehrere öffnen zu lassen (. die Koordinaten sind alle gleich und können nicht gesehen werden) und schalten Sie sie dann aus. Schließen Sie, was auch immer darüber ist. Was ich hier mache, ist, einen Indexparameter zu ajaxSetup hinzuzufügen (dieses Ding kann andernfalls nur in das festgelegte Objekt geschrieben werden). Alle Ajaxe teilen sich immer noch den gleichen. Was soll ich mit dem Index tun?

■ Es gibt eine andere Lösung, mit der Sie diese Steuerlogik selbst schreiben können. Zeigen Sie nur ein Ladefeld an und schreiben Sie in das Ladefeld, wie viele Ajax-Parameter gerade ausgeführt werden, ähnlich wie bei ac51fc333d1a97bf81d3a21c2a23383494b3e26ee717c64999d7867364b1b4a3 Behalten Sie bei jedem Start oder Ende den Wert von Ajax-Cout bei und beurteilen Sie, wann Ajax endet. Wenn die Daten-Ajax-Anzahl kleiner oder gleich 0 ist, sollte dies der Fall sein Es ist möglich, p auszublenden, aber ich habe diese Methode nicht praktiziert.

$(function () {
$.ajaxSetup({
layerIndex:-1,
beforeSend: function () {
this.layerIndex = layer.load(0, { shade: [0.5, '#393D49'] });
},
complete: function () {
layer.close(this.layerIndex);
},
error: function () {
layer.alert('部分数据加载失败，可能会导致页面显示异常，请刷新后重试', {
skin: 'layui-layer-molv'
, closeBtn: 0
, shift: 4 //动画类型
});
}
});
});

Das oben Gesagte habe ich für alle zusammengestellt. Ich hoffe, dass es in Zukunft für alle hilfreich sein wird.

Verwandte Artikel:

Schleifenschema in Ajax

Eine kurze Diskussion über Bootstraps DatePicker-Datumsbereichsauswahl

Ein einfaches Beispiel für die Verwendung von XPath in dom4j

Das obige ist der detaillierte Inhalt vonKonfiguration der globalen Ajax-Ladebox (Ladeeffekt). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!