Gibt es eine Möglichkeit zu erkennen, wenn ein browser-Fenster gerade nicht aktiv ist?
Habe ich JavaScript, das tut der Aktivität in regelmäßigen Abständen. Wenn der Benutzer nicht auf der Suche auf der Website (d.h., das Fenster oder die Registerkarte nicht im Fokus ist), es wäre schön, nicht zu laufen.
Gibt es eine Möglichkeit, dies zu tun mit JavaScript?
Mein Bezugspunkt: Gmail-Chat-spielt einen sound ab, wenn die Fenster, die Sie verwenden nicht aktiv ist.
Für diejenigen, die nicht zufrieden sind mit den Antworten unten, schauen Sie sich die
Dokument.Körper.onblur=function(e){console.log('lama');} gearbeitet, für nicht fokussierte Elemente.
Siehe Antwort für eine cross-browser-kompatible Lösung, die verwendet die W3C-Sichtbarkeit der Seite-API, fallen zurück
80% der Antworten sind nicht die Antworten auf diese Frage. Die Frage fragt nach nicht aktiv sondern auch Tonnen von Antworten unten sind über nicht sichtbar das ist keine Antwort auf diese Frage. Sie sollte wohl geflaggt werden als "keine Antwort"
requestAnimationFrame
- API, oder verwenden Sie die moderne Funktion, die die Häufigkeit der setTimeout
/setInterval
wird reduziert, wenn das Fenster nicht sichtbar ist (1 sec in Chrome zum Beispiel).Dokument.Körper.onblur=function(e){console.log('lama');} gearbeitet, für nicht fokussierte Elemente.
Siehe Antwort für eine cross-browser-kompatible Lösung, die verwendet die W3C-Sichtbarkeit der Seite-API, fallen zurück
blur
/focus
in Browsern, die dies nicht unterstützen.80% der Antworten sind nicht die Antworten auf diese Frage. Die Frage fragt nach nicht aktiv sondern auch Tonnen von Antworten unten sind über nicht sichtbar das ist keine Antwort auf diese Frage. Sie sollte wohl geflaggt werden als "keine Antwort"
InformationsquelleAutor Luke Francl | 2009-06-29
Du musst angemeldet sein, um einen Kommentar abzugeben.
Da ursprünglich das schreiben dieser Antwort eine neue Spezifikation erreicht hat Empfehlung status durch das W3C. Die Page-Visibility-API (auf MDN) erlaubt es uns nun, um genauer zu erkennen, wenn eine Seite versteckt ist, um den Benutzer.
Aktuelle browser-Unterstützung:
Folgende code nutzt die API, fällt zurück auf das weniger zuverlässige blur/focus-Methode in inkompatiblen Browsern.
onfocusin
undonfocusout
sind erforderlich für den IE 9 und niedriger, während alle anderen nutzenonfocus
undonblur
, außer für iOS, welche nutztonpageshow
undonpagehide
.hidden
zweimal?das ist, warum meine Antwort wird insbesondere erwähnt, dass die Sichtbarkeit der Seite-API, die in working draft-status, nachdem ursprünglich schrieb ich meine Antwort. Die focus/blur Methoden bieten eine eingeschränkte Funktionalität für ältere Browser. Die Bindung an andere Ereignisse, wie in deiner Antwort, nicht gerade viel mehr als das und mehr Gefahr, Unterschiede im Verhalten (wie bei IE nicht feuern, mouseout, wenn ein Fenster öffnet sich unter dem cursor). Ich würde vorschlagen, eine weitere geeignete Maßnahme wäre, zur Anzeige einer Nachricht oder ein Symbol, das anzeigt, um den Benutzer, dass updates weniger Häufig durch Seite Inaktivität.
Ich habe versucht, diese Lösung auf Chrom. Es funktioniert wenn ich tabs, aber es funktioniert nicht wenn ich windows (ALT+tab). Sollte es? Hier ein fiddle - jsfiddle.net/8a9N6/17
Ich würde gerne halten Sie den code in der Antwort der minimale für jetzt. Es war nie beabsichtigt, ein Schnitt-und-einfügen komplette Lösung, wie implementors vielleicht möchten Sie vermeiden, die Einstellung einer Klasse auf dem Körper und nehmen einen völlig anderen Handlung zusammen (wie das stoppen und starten eines Zeitgebers).
Deine Lösung scheint zu funktionieren nur, wenn der Benutzer änderungen tabs oder minimiert/maximiert das Fenster. Aber das onchange-Ereignis wird nicht ausgelöst, wenn der Benutzer verlässt das tab aktiv, aber maximiert Sie ein anderes Programm über es aus der Taskleiste. Gibt es eine Lösung für dieses Szenario? Danke!
InformationsquelleAutor
Ich würde jQuery verwenden, weil dann alles, was Sie zu tun haben ist dies:
Oder zumindest es funktionierte für mich.
Dies tut in der Tat Arbeit?
für mich ist dieses Gespräch zweimal im iframe
Dies funktioniert nicht mehr für aktuelle Versionen moderner Browser finden Sie in der zugelassenen Antwort (Page-Visibility-API)
Es funktioniert in chrome 51.0.2704.106 m
InformationsquelleAutor Carson Wright
Gibt es 3 typische Methoden verwendet, um zu bestimmen, ob der Benutzer die HTML-Seite, aber keiner von Ihnen funktioniert perfekt:
Den W3C Page Visibility API ist, dies zu tun (gefördert seit: Firefox 10, " MSIE 10, Chrome 13). Jedoch, diese API nur löst Ereignisse aus, wenn Sie die browser-Registerkarte wird vollständig überschrieben (z.B. wenn der Benutzer wechselt von einem tab zu einem anderen). Die API keine Ereignisse auslösen, wenn die Sichtbarkeit nicht bestimmt werden kann mit 100% Genauigkeit (z.B. Alt+Tab, um zu einer anderen Anwendung wechseln).
Mit focus/blur-basierte Methoden gibt Ihnen eine Menge von false positives. Zum Beispiel, wenn der Benutzer zeigt ein kleineres Fenster auf dem browser-Fenster das browser-Fenster verliert den Fokus (
onblur
erhöht), aber der Benutzer trotzdem in der Lage, es zu sehen (also es müssen noch aktualisiert werden). Siehe auch http://javascript.info/tutorial/focusZur Verbesserung der unvollkommenen Verhalten oben beschrieben, verwende ich eine Kombination der 3 Methoden: W3C-Visibility-API, dann focus/blur-und Benutzer-Aktivität Methoden zur Reduzierung der false-positive-rate. Dies ermöglicht das verwalten folgender Ereignisse:
Dies ist, wie es funktioniert: wenn Sie das Dokument verlieren den Fokus, die Benutzer-Aktivitäten (z.B. Maus bewegen) auf das Dokument überwachen, um zu bestimmen, ob das Fenster sichtbar ist oder nicht. Die Sichtbarkeit der Seite Wahrscheinlichkeit ist Umgekehrt proportional zu der Zeit des letzten Benutzers die Aktivität auf der Seite: wenn der Benutzer keine Aktivität auf das Dokument für eine lange Zeit, die Seite ist wahrscheinlich nicht sichtbar. Der code unten ahmt die W3C-Sichtbarkeit der Seite-API: es verhält sich genauso, hat aber eine kleine false-positive-rate. Es hat den Vorteil der multibrowser (getestet auf Firefox 5, Firefox 10, MSIE 9, MSIE 7, Safari 5, Chrome 9).
Da es derzeit keine funktionierende cross-browser-Lösung ohne false positive, Sie sollten sich besser zweimal überlegen, über die Deaktivierung der regelmäßigen Aktivität auf Ihrer Website.
Es funktioniert nicht mit alt+tab
Tatsächlich funktioniert es mit Alt+Tab. Sie können nicht feststellen, ob die Seite versteckt ist, wenn man einen Alt+Tab, da Sie möglicherweise den Wechsel zu einem kleineren Fenster, so dass Sie nicht garantieren können, dass Ihre Seite komplett ausgeblendet. Dies ist der Grund, warum ich den Begriff "potentiell versteckte" (in dem Beispiel liegt der Schwellenwert festgelegt, bis zu 4 Sekunden, so müssen Sie zu einem anderen Fenster wechseln mit Alt+Tab für mindestens 4 Sekunden). Aber Ihr Kommentar zeigt, dass die Antwort nicht so klar war, so habe ich umformuliert es.
Ich denke, das ist die bisher beste Lösung. Allerdings ist der code oben extrem braucht einige refactoring und Abstraktionen. Warum gehst du nicht laden Sie es auf GitHub und lassen Sie die community refactoring?
Ich bin froh, Sie mochte meine Lösung. Fühlen Sie sich frei, um zu fördern, es in einem GitHub-Projekt selbst. Ich gebe den code der Lizenz Creative Commons BY creativecommons.org/licenses/by/4.0
InformationsquelleAutor Julien Kronegg
Gibt es eine nette Bibliothek, die auf GitHub:
https://github.com/serkanyersen/ifvisible.js
Beispiel:
Ich getestet habe version 1.0.1 auf allen Browsern die ich habe und kann bestätigen, dass es funktioniert mit:
... und wohl allen neueren Versionen.
Nicht vollständig mit der Arbeit:
.now()
gibt immertrue
für mich)Genial lib! danke! Stern.
InformationsquelleAutor omnomnom
Mit : Page-Visibility-API
Kann ich verwenden ? http://caniuse.com/#feat=pagevisibility
Ich denke, der OP spricht nicht über ide-Funktion
Ich Rede nicht von ide. Ich Rede hier über alt-Tab/cmd-Tab zu einer anderen app. Plötzlich ist die Seite nicht aktiv. Die page-visibility-api nicht helfen, mich wissen wenn die Seite nicht aktiv ist, es hilft nur Sie mich wissen, wenn das ist möglicherweise nicht sichtbar.
InformationsquelleAutor l2aelba
Erstelle ich ein Komet Chat für meine app, und wenn ich eine Meldung eines anderen Nutzers, die ich benutze:
document.hasFocus()
ist der sauberste Weg, es zu tun. All die anderen Möglichkeiten, die Verwendung der Sichtbarkeit api-oder Ereignis-basiert oder auf der Suche für die verschiedenen Ebenen der Benutzer-Aktivität/mangelnde Aktivität zu kompliziert geworden, und voller Grenzfälle und Löcher. legen Sie es auf ein einfaches Intervall und heben Sie ein benutzerdefiniertes Ereignis aus, wenn sich die Ergebnisse ändern. Beispiel: jsfiddle.net/59utucz6/1Effiziente, und im Gegensatz zu den anderen Lösungen gibt feedback, wenn Sie wechseln Sie zu einem anderen browser-tab oder Fenster, und auch eine andere Anwendung.
InformationsquelleAutor infinito84
Dies ist wirklich schwierig. Es scheint keine Lösung gegeben, die folgende Anforderungen.
Dies geschieht, weil:
Angesichts dieser Einschränkungen ist es möglich, implementieren eine Lösung, die verbindet
- Die page-Visibility-API
- Fenster Weichzeichnen/focus
- Dokument.activeElement
Ist in der Lage:
Wenn der iframe hat Fokus, Ihre Unschärfe/Fokus-Ereignisse erhalten nicht aufgerufen, und die page Visibility API, nicht ausgelöst, über alt+tab.
Baute ich auf @AndyE ' s-Lösung und implementiert diese (fast gut) Lösung hier:
https://dl.dropboxusercontent.com/u/2683925/estante-components/visibility_test1.html
(sorry, ich hatte einige Probleme mit JSFiddle).
Dies ist auch verfügbar auf Github: https://github.com/qmagico/estante-components
Dies funktioniert in chrome/chromium.
Es funktioniert auf firefox, außer, dass es nicht geladen wird der iframe-Inhalt (keine Ahnung warum?)
Trotzdem, zu lösen das Letzte problem (4), die einzige Weise, die Sie tun können, ist zu hören für blur/Fokus-Ereignisse auf den iframe.
Wenn Sie haben einige Kontrolle über die iframes haben, können Sie die postMessage-API zu tun.
https://dl.dropboxusercontent.com/u/2683925/estante-components/visibility_test2.html
Habe ich noch nicht getestet, mit genug Browser.
Wenn Sie können finden Sie mehr info darüber, wo dies nicht funktioniert, bitte lassen Sie mich wissen in den Kommentaren unten.
Funktioniert überhaupt NICHT auf dem IPad. 🙁
Es scheint das IPAD braucht eine ganz andere Lösung - stackoverflow.com/questions/4940657/...
Alle diese links sind 404 🙁
InformationsquelleAutor
Begann ich mit dem community-wiki Antwort, aber ihm war klar, dass es nicht erkennen "alt + tab" Ereignisse in Chrom. Dies ist, weil es verwendet den ersten verfügbaren Quelle, und in diesem Fall ist es die Sichtbarkeit der Seite-API, die in Chrome scheint nicht track-alt-tabbing.
Ich beschlossen, ändern Sie das Skript ein bisschen zu verfolgen alle möglichen Ereignisse für Seite der Fokus ändert. Hier ist eine Funktion Sie können die drop-in:
Verwenden Sie es wie diese:
Chrome zum Beispiel hat sowohl
document.hidden
unddocument.webkitHidden
. Ohne dieelse
imif
Konstruktion, die wir erhalten würden, 2 callback-Anrufe wahr?Das ist ein guter Punkt, ich glaube nicht, dass der! Wenn Sie dieses Bearbeiten können post-go ahead, und ich werde akzeptieren 🙂
InformationsquelleAutor Daniel Buckmaster
http://jsfiddle.net/ARTsinn/JTxQY/
InformationsquelleAutor yckart
u verwenden können :
InformationsquelleAutor maryam
In HTML 5 könnte man auch verwenden:
onpageshow
: Skript zu starten, wenn das Fenster sichtbar wirdonpagehide
: Skript zu starten, wenn das Fenster ausgeblendet istFinden Sie unter:
InformationsquelleAutor roberkules
Etwas kompliziertere Weg wäre, um
setInterval()
zu überprüfen, position der Maus und im Vergleich zum letzten check. Wenn die Maus nicht bewegt in einer bestimmten Zeit, wird der Benutzer wahrscheinlich im Leerlauf.Dies hat den zusätzlichen Vorteil, zu sagen, wenn der Benutzer inaktiv ist, statt nur zu prüfen, ob das Fenster nicht aktiv ist.So viele Menschen haben darauf hingewiesen, dies ist nicht immer ein guter Weg, um zu überprüfen, ob die Benutzer-oder browser-Fenster inaktiv ist, da der user vielleicht gar nicht mit der Maus oder ist es ein video anschauen, oder ähnliches. Ich bin nur darauf hindeutet, eine Möglichkeit zu überprüfen, für idle-ness.
Verwandte: Going Commando - codinghorror.com/blog/archives/000825.html
Es ist codinghorror.com/blog/2007/03/... jetzt.
Auch dies doesn ' T play dice, wenn der Nutzer ein video anschauen
Sie verwenden könnte, onkeypress oder ähnlichen Veranstaltungen, um den timer zurückzusetzen und zu lösen, das nicht-Maus-Problem. Natürlich ist es immer noch nicht funktionieren würde für den Benutzer aktiv auf der Suche auf der Seite ein video anschauen, studieren, ein Bild, etc.
InformationsquelleAutor Austin Hyde
Dies ist eine Anpassung der Antwort von Andy E.
Dies zu tun, eine Aufgabe, z.B. aktualisieren Sie die Seite alle 30 Sekunden
aber nur wenn die Seite sichtbar ist, und konzentrierte sich.
Wenn die Sichtbarkeit kann nicht erkannt werden, nur dann gefasst werden, verwendet.
Wenn der Benutzer konzentriert sich die Seite, dann wird es sofort ein update
Die Seite nicht aktualisieren, erneut, bis 30 Sekunden nach jedem ajax-Aufruf
InformationsquelleAutor roger
Für eine Lösung ohne jQuery check-out Visibility.js, die Auskunft über Seite drei Staaten
und auch convenience-Wrapper für setInterval
Einem fallback für ältere Browser (IE < 10; iOS < 7) ist ebenfalls verfügbar
InformationsquelleAutor Niko
Für angular.js hier ist eine Richtlinie, die (auf der Grundlage der akzeptierten Antworten) erlauben, Ihren controller zu reagieren, um eine änderung in Sicht:
Können Sie es verwenden, wie in diesem Beispiel:
<div react-on-window-focus="refresh()">
, worefresh()
ist eine scope-Funktion im Rahmen von was auch immer-Controller ist im Umfang enthalten.InformationsquelleAutor Steve Campbell
dies funktioniert für mich auf chrome 67, firefox 67,
InformationsquelleAutor El Pr0grammer
Wenn Sie handeln wollen auf ganze browser Unschärfe:
Wie ich sagte, wenn der browser) an Fokussierung verliert, keine der vorgeschlagenen Ereignisse ausgelöst. Meine Idee ist, zu zählen, bis in einer Schleife und den Zähler zurücksetzen, wenn ein Ereignis Feuer. Wenn der Zähler ein limit erreichen, mache ich einen Standort.href auf eine andere Seite. Dies ist auch Feuer, wenn Sie auf dev-tools.
Dies ist ein Entwurf erfolgreich getestet auf FF.
InformationsquelleAutor B.F.
Wollte nur hinzufügen:
Die Frage ist nicht klar geschrieben.
"Wenn der Benutzer nicht auf der Suche auf der Website (d.h., das Fenster oder der tab nicht aktiv ist)..."
Kann ich eine Website, wenn es nicht mit dem Fokus. Die meisten desktop-Systeme sind in der Lage zu zeigen, die windows parallel 🙂
Deshalb die Sichtbarkeit der Seite-API ist wohl die richtige Antwort, weil es verhindert, dass die Aktualisierung der Website, wenn Sie die "Benutzer ist nicht in der Lage, um zu sehen, updates", die sehr unterschiedlich sein können "- Registerkarte nicht im Fokus".
InformationsquelleAutor HolgerJeromin