Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „[jQuery] Page Load alle 5 Sekunden, vorher Ladebalken zeigen“

afr0kalypse

Allwissendes Karmameerschweinchen!

Hi zusammen,
ich habe folgendes jQuery Script:
Code:
var refresh = setInterval(function(){       
            // Load the php file that handles the data, send request via POST by using JSON {"arg" : "value" }
            jQuery("#description_span").load(page.php", {arg : val}); 
        },5000);
Das Script soll eben via POST bestimmte Infos alle 5 Sekunden an eine Seite page.php schicken.
Das funktioniert auch wunderbar.
Allerdings wird in den ersten 5 Sekunden nichts angezeigt. Die erste Response dauert also 5 Sekunden. Für diese erste Response möchte ich nun gerne einen Ladebalken oder ein Loading Gif oder so anzeigen.
Hat jemand ne Idee wie man das schick umsetzen kann?

EDIT:
Ich habe es erstmal so gelöst:
Code:
<span id="description_span"><p id="loading">Einen Moment bitte...</p></span>
...
...
jQuery('#loading').ajaxStart(function() {
        jQuery(this).show();
    }).ajaxStop(function(){
        jQuery(this).hide();
    })
Vielleicht kennt ja jemand einen eleganteren, kürzeren Weg :)
 
Zuletzt bearbeitet:

Curanai

Aktives Mitglied

AW: [jQuery] Page Load alle 5 Sekunden, vorher Ladebalken zeigen

Aaaaalso ... ein paar Verbesserungsvorschläge, die Du vielleicht verwenden kannst (Aufzählung dient nicht der Belehrung, sondern der besseren Lesbarkeit):

[ 1. ] .load() ist nicht $.post()! $.load() kannst Du eher mit $.get() vergleichen ...
[ 2. ] Bekommst Du keine Antwort aus dem Cache? (= gleiches Ergebnis; vgl. Firebug)
[ 3. ] "refresh" sollte mit "$(document).ready()" erst beginnen ... (Performance!?)
[ 4. ] "refresh" sollte sich selbst aufrufen - also als Funktion, die nach "Rückkehr" (Response) den Timer erstellt, fünf Sekunden wartet, den Timer aufhebt ... also nicht global im JavaScript angelegt, sondern nur innerhalb der Funktion und das nur temporär.
[ 5.] Statt "jQuery" evtl. nur "$" nehmen (weniger Dateigröße).
[ 6. ] Fehlerbehandlung wäre wo (User offline [Zwangstrennung], Server has gone away, ...)? Du setzt grundlegend voraus, dass der User immer eine Antwort bekommt ...
[ 7. ] page.php" (!) kann nicht stimmen ... Anführungszeichen fehlt!!
[ 8. ] Trenne AJAX-Scripte von üblichen Dateien (= Unterverzeichnis); macht es viel pflegeleichter und Du findest schneller entsprechende Dateien ...
[ 9. ] Hat "page.php" einen Mechanismus/eine Abhängigkeit drin, dass ich die Datei nicht verwenden könnte? Scriptkiddies sind einfallsreich ...
[ 10. ] User ohne JavaScript spielen bei mir auch keine Rolle ... selbst schuld. ;)

Unabhängig von Punkt 4 oben: Wenn Du einen Ladebalken (grafische Anzeige von "da kommt gleich was") haben willst, verwendest Du die maximal "100 %" (fertig) als Ausgangsbasis, dividierst durch die Wartezeit (5 Sekunden) und bekommst "20 % Zuwachs" je Sekunde. Hierzu eignet sich ein DIV, welches im Sekundentakt 20 % mehr Hintergrundfarbe bekommt ... oder ein einfarbiges IMG innerhalb eines DIV, welches in der width je Sekunde um 20 % anwächst ... und ja, das bedeutet, dass Du einen weiteren Timer benötigst, der genau dies regelt (aber abgebrochen werden muss, wenn "refresh" das erste Mal läuft).

Soviel als Anregung von mir ... ;)

Grüße vom Kaffeebecherrand.
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Statistik des Forums

Themen
175.155
Beiträge
2.581.854
Mitglieder
67.221
Neuestes Mitglied
opaklaus
Oben