2016-05-12 19 views
0

Ich habe mit diesem seit einiger Zeit zu kämpfen - ich habe ein Dokument, das im Wesentlichen ist dies:iFrames und Erkennung Fokus wieder

<html> 
    <head></head> 
    <body> 
     some divs and stuff 

     <div id="content"> 
      <iframe src="" id="content_frame"></iframe> 
     </div> 
    </body> 
</html> 

Was mit dieser speziellen Seite wesentlich ist, ist, dass sie weiß, wenn etwas auf der Seite hat den Fokus. Das ist eigentlich ziemlich einfach, und arbeitet mit zwei einfachen Funktionen:

window.onblur=function(){ // when you leave the window 
    if(conn != null) { 
     if (document.activeElement == document.getElementById("content_frame")) {    
        send_message_to_server(JSON.stringify({'type':'upd','ele':'vis','status':true})); 
     beep_off(conn.peer); 
     } else { 
      send_message_to_server(JSON.stringify({'type':'upd','ele':'vis','status':false})); 
      beep_on(conn.peer); 
     } 
    } 
}; 

window.onfocus=function(){ // when you focus the window 
    if(conn != null) { 
     send_message_to_server(JSON.stringify({'type':'upd','ele':'vis','status':true})); 
     beep_off(conn.peer); 
    } 
}; 

Das Problem, das ich habe ist, dass, wenn die „iframe“ gewählt, es Fokus hat - das heißt, wenn die Fenster Unschärfen (ändern Registerkarte oder was auch immer), hat der iframe immer noch den Fokus innerhalb des Fensters und löst daher eine Nachricht aus, wie sie immer noch Fokus hat.

Kurz gesagt, was ich brauche ist:

  • Wenn der Iframe oder der reguläre Teil des Geländes Fokus hat, es feuert „true“.
  • Wenn keine der Websites den Fokus hat (sie haben möglicherweise auf Entwickler-Tools, die Suchleiste, geänderte Tabs usw. geklickt), wird "false" ausgelöst.

Zeit, was ich habe ist:

  • Wenn die Seite hat konzentrieren sie feuert "true". (gut)
  • Wenn jedoch der Iframe den Fokus hat und Sie Tabs ändern, Entwicklerwerkzeuge oder Adressleiste usw. anklicken, wird immer noch "true" ausgelöst. (schlecht)
  • Wenn irgendetwas anderes den Fokus hat und Sie Registerkarten ändern, Entwicklerwerkzeuge oder Adressleiste usw. anklicken, wird "false" ausgelöst. (Gut)

Was ich habe auch versucht:

  • Viele Permutationen des obigen Codes.
  • $ ('iframe'). Is (': focus'); als Flag, wenn der Iframe den Fokus hat oder nicht (das scheint nicht zu funktionieren).
+0

Was ist "conn"? Wo ist es definiert? – zer00ne

+0

'activeElement' ist für Formularelemente. 'window.onfocus' könnte auf iframe stecken bleiben, weil ein iframe ein eigenes window-Objekt sowie ein eigenes Dokument besitzt. – zer00ne

+0

conn ist eine P2P-Verbindung zu einem Host - im Grunde versucht es, den Host zu aktualisieren, wenn der Benutzer das Fenster verlässt. –

Antwort

0

Die iframe ist ein ganz anderer Kontext. Sie müssen Ereignishandler im iframe-Dokument einrichten und diese Ereignisse zurück an das Hauptfenster senden, indem Sie etwas wie iframe.postMessage oder window.top verwenden. Wenn Sie postMessage verwenden, müssen Sie im übergeordneten Fenster nach message Ereignissen suchen und diese entsprechend analysieren, um herauszufinden, welche Ereignisse innerhalb der iframe ausgelöst wurden.

+0

danke - meinst du auf das Dokument selbst? Das Dokument selbst ist wahrscheinlich ein Google-Formular oder so etwas ... –

+1

Ich fürchte, das ist nicht machbar, wenn Sie eine andere Domain innerhalb des Iframe hosten, soweit ich weiß. Selbst der Versuch, auf das iframe.contentWindow zuzugreifen, wird ausgelöst. Dies ist eine Sicherheitsbeschränkung für den Browser, die verhindert, dass Sie Seiten mit einer anderen Domäne manipulieren können. "Iframes" sind in dieser Hinsicht sehr begrenzt, sollten Sie eine Alternative in Erwägung ziehen, vielleicht ein neues Fenster zu öffnen, das mit seinem Elternteil kommunizieren kann. – yelsayed

+0

Ah ok, das ist eine Schande - das neue Fenster wird nicht funktionieren, weil mein Javascript die Kontrolle über das Fenster haben muss, einschließlich des Iframes (obwohl nicht das, was im Iframe ist, hat mein JS keine Kontrolle darüber). Ich werde etwas einbetten, um zu sehen, ob es anders funktioniert ... –