Gewusst wie: laden Sie dynamischen Inhalt in ein DIV mit JQuery

Ich habe ein div:

<div id="content"></div>

Und wenn die Seite geladen wird, nenne ich ein .load(). Das laden dauert etwa 10 Minuten dauern und während der Ausführung Ihrer PHP-Datei wieder einige Informationen sagen über den status der Ausführung, so etwas wie Linux laden. Ich will tun, diese Informationen innerhalb des div - #content dynamisch, aber .load() setzt nur am Ende der Ausführung. Kann jemand mir bitte helfen, dies zu tun?

Den .load() nennen:

$("#content").load("/admin/ajax/analyse.php");
  • Wenn Sie fügen Sie die gleiche URL in ein browser-Fenster, dauert es 10 Minuten?
  • Ja, es ist ein wenig schwer
  • Dann gibt es nichts, was Sie tun können, auf dem client-Ende dieses Problem zu beheben. Sie müssen re-Faktor, wie Sie Ihre server-side-code funktioniert.
  • Wenn Sie hier Lesen, api.jquery.com/load , Sie werden sehen, eine Funktion namens "abgeschlossen" dokumentiert. Setzen Sie die Funktion in der 3. parameter für den Aufruf von "laden" und es wird aufgerufen, wenn die Daten fertig geladen wurden. Der Parameter enthält die Daten. Versuchen Sie, einige code und Holen Sie sich zurück zu uns.
  • Sollten Sie kick-off-Prozess und die andere ruft die ping-server, um updates zu erhalten. Sie sind nicht zu machen "websocket" mit einer http-Aufruf. Vielleicht sollten Sie in web-sockets. 😉
  • Ich möchte die Ausgabe dynamisch, vor dem Ende der Ausführung
  • Sie sind fehlt den Punkt. Der OP will die stream-Daten nach unten, wie der server gibt es. Nicht ein Stück.
  • So funktioniert die server erzeugen die Daten Zeile für Zeile, so zu sprechen? Erwirtschaftet es einige der Daten, es zu senden, erzeugen einige mehr, senden Sie einige mehr, und so weiter? Hat OP die Kontrolle über den server? Kann OP änderungen an der Art, wie es funktioniert?
  • Ja, ich Daten zeilenweise. Ja, ich habe die Kontrolle über den server.
  • Hinzufügen andere Frage ... funktioniert die Seite geladen werden, wenig durch wenig, von oben nach unten, wenn Sie fügen Sie die URL in ein browser-Fenster?
  • Wenn Sie versuchen, öffnen Sie die Seite in einem browser, ich habe die Seite in kleinen, innerhalb der 10 Minuten-Intervall.

InformationsquelleAutor Marcio Mazzucato | 2013-01-18
  1. 3

    jQuery-ajax-Schnittstelle nicht einen Weg, um den Arbeitsfortschritt für eine Antwort (auch wenn es behauptet, eine Obermenge des Browsers die native XMLHttpRequest Objekt). Offenbar, so ein use-case ist undenkbar, das die jQuery-Entwickler:

    Kein onreadystatechange Mechanismus vorgesehen, jedoch seit success, error, complete und statusCode deckt alle erdenklichen Anforderungen.

    Mit der ein XMLHttpRequest können Sie direkt Lesen Sie den aktuellen Fortschritt einer Reaktion in einem onreadystatechange event-handler:

    var xhr = new XMLHttpRequest();
xhr.open("GET", "/admin/ajax/analyse.php", true);
xhr.onreadystatechange = function receiveUpdate(e) {
    $("#content").html(this.responseText);
}
xhr.send();

    Dies funktioniert in den neuesten Versionen der meisten Browser, inklusive IE 10, Chrome und Firefox.

    Demos:

    • Es funktioniert teilweise, nach ca 4 Minuten hört es auf zu empfangen die Informationen über den status der Ausführung. Wissen Sie, was dies sein kann?
    • Für mich funktioniert: jumpingfishes.com/progresstest2.htm. Könnte es an deinem server? Wenn nichts gesendet wird Ihr server für eine lange Zeit, erhalten Sie keine updates in dieser Zeit.
    • Vielen Dank! Ich werde analysieren, was passiert ist, vielleicht können die ein-server-Konfiguration. Anyway, ich danke Ihnen sehr!
    InformationsquelleAutor gilly3
  2. 0

    Gibt es ein paar Möglichkeiten, um dieses Problem anzugehen, aber alle von Ihnen erfordern wird, die server-Seite ändert. Eine Lösung (die ich denke am besten passt, wie man sich dies vorzustellen, um zu arbeiten) ist long polling.

    Sehen diese Frage auf die lange Abfragen mit PHP und jQuery.

    InformationsquelleAutor George
  3. 0

    Dies ist nur eine Idee, die Sie hätten, zu Spülen ...

    Auf dem server,

    1. ein Nutzer die URL #1,
    2. eine Sitzung gestartet wird, wenn es nicht bereits.
    3. starten einer asynchronen Prozess der Erzeugung der Daten.
    4. als es wird ein Teil der Daten beendet, wird es in eine Warteschlange gestellt. Einfach gesagt, es legt die Daten in Blöcken irgendwo. Könnte eine Datenbank an einen cache im Speicher.
    5. Wenn alle Daten, die erzeugt wird durch die asynchrone Aufgabe, sendet es über eine Datei-Ende-Anzeige, indem Sie einige Magische Zeichenfolge.

    Auf dem server auch:

    1. die gleichen user trifft, URL #2 (und Sie wissen aus der session info)
    2. geben Sie ihm einen Teil der Daten von der Vorderseite der Warteschlange.
    3. jedes mal, wenn er trifft, URL #2 geben Sie ihm etwas mehr Daten.
    4. wenn der browser ein letztes mal, und alles, was übrig ist ist die Ende-der-Datei-Angabe, kann der server wieder einige HTTP-Ergebniscode, der angibt, keine Daten mehr, oder es können wieder die Magische Zeichenfolge.

    Auf der client-Seite,

    1. tun Sie Ihre ajax-Anfrage an die URL #1 um den server zu starten, erzeugen.
    2. die Ausgabe von Anfragen, gegen URL #2 wiederholt.
    3. Jedes Ergebnis wird angehängt, um die Seite element, so kann der Benutzer sehen, wie es ankommt.
    4. Wenn die client-Anforderung gibt die "keine Daten mehr" Ergebnis-code (oder die Magie end-of-file string), es wird beendet, um weitere Daten und Signale an den Benutzer, indem Sie etwas auf dem Bildschirm anzeigt, dass alle Daten vorhanden sind.

    Sollte für Sie arbeiten.

    InformationsquelleAutor Lee Meador
Schreibe einen Kommentar