Scrolle zum Ende der Seite, wenn neuer Inhalt hinzugefügt (kein AJAX beteiligt)

Question

Ich habe ein PHP-Skript, das ich nicht ändern kann, das einige Befehle auf einem Linux-Rechner ausführt und STDOUT und STDERR auf der Webseite pipes. Wenn die PHP-Seite angefordert wird, wird sie geladen, bis alle Befehle beendet sind. Die Ausgabe erscheint auf der Seite, wie sie auf dem Linux-Rechner erzeugt wird.

Derzeit, wenn neue Inhalte hinzugefügt werden, wird es (schließlich) unterhalb der Ansicht auf der Seite so hinzugefügt, dass ich manuell nach unten scrollen muss, um es zu sehen. Ich suche nach einer Möglichkeit, die Seite nach unten zu scrollen, oder um zu scrollen, wenn neuer Inhalt hinzugefügt wird.

Irgendwelche Ideen?

Hinweis: Ich habe $('html, body').animate({scrollTop:$(document).height()}, 'slow'); aus 18252285 versucht, aber es funktioniert nicht. Ich werde im Anschluss an den in der Chrome-Konsole:

Uncaught TypeError: Cannot read property 'scrollHeight' of null 

Answer 1

Sie können die Scroll-SetInterval, wird dies die Seite halten

gescrollt nach unten

var simulateServerOutput = window.setInterval(function() { 
    var $newElem = $('<div/>', { 
    'html': Math.random().toString(36).substring(7) 
    }).appendTo('.content'); 
}, 1000); 


var autoScroll = window.setInterval(function() { 
    var $target = $('html,body'); 
    $target.animate({scrollTop: $target.height()}, 1000); 
}, 500); 

Beispiel: https://jsfiddle.net/byLc06ez/1/

Das sieht gut aus, aber wie würde ich diese Rolle Schleife beenden? Das heißt, nach dem Laden der Seite, möchte ich nicht, dass es automatisch nach unten scrollen . Gibt es einige js, die ich an das Ende anhängen kann, nachdem alle Linux-Befehle beendet haben, wird das aufhören? - synaptik 45 Min vor

ein Intervall löschen (Stopp it) Sie können einfach ausführen clearInterval(autoScroll); Aber Sie case wie Sie wissen, wenn die Seite fertig geladen? Sie könnten $(document).ready(function(){ ..... }); verwenden, aber das hängt tatsächlich vom Browser ab.

so könnte ein komplizierterer Ansatz erforderlich sein, wie zum Beispiel das Erstellen eines Snapshots des geladenen Inhalts $ ('. Content'). Html() Vergleichen Sie es jede Sekunde mit dem letzten Snapshot und sehen Sie, ob es anders ist. Wenn dies nicht der Fall ist, bedeutet das, dass das Laden beendet ist. dann können Sie den Timer löschen.

Answer 2

Try this -

setInterval(function() { 
    window.scrollTo(0,document.body.scrollHeight); 
}, 10); 

Nach jeweils 10 ms, wird die Seite nach unten nach unten gescrollt. Danke und lassen Sie mich wissen, wenn Sie irgendwelche Bedenken haben.