2012-04-05 5 views
9

Sto davvero cercando qualcosa che funzioni con tutti i browser più diffusi (IE9, Chrome, Firefox, Safari) e fino a IE8.Esiste una soluzione cross-browser per il monitoraggio quando viene modificato l'ID document.active?

Sebbene, stavo cercando un modo per mettere a fuoco un oggetto di spostamento Flash dopo che ha perso il focus, ho trovato che tutti i modi storici di fare questo falliscono. Presumo che sia ancora un altro problema di sicurezza.

Quindi, sto cercando ora come monitorare gli eventi di modifica di qualche tipo per document.activeElement (anche se "modifica" non si verifica realmente).

risposta

8

Mentre la risposta di @ James sopra è corretta. Ho aggiunto ulteriori dettagli per renderlo una soluzione completamente funzionante con l'uso anche dell'evento focus.

<html> 
<body> 
    <input type="text" id="Text1" name ="Text1" value=""/> 
    <input type="text" id="Text2" name ="Text2" value=""/> 
    <SELECT><OPTION>ASDASD</OPTION><OPTION>A232</OPTION></SELECT> 
    <INPUT TYPE="CHECKBOX" id="Check1"/> 
    <INPUT type="TEXT" id="text3"/> 
    <input type="radio"/> 
    <div id="console"> </div> 
    <textarea id="textarea1"> </textarea> 
    <script> 

     var lastActiveElement = document.activeElement; 

     function detectBlur() { 
      // Do logic related to blur using document.activeElement; 
      // You can do change detection too using lastActiveElement as a history 
     } 

     function isSameActiveElement() { 
      var currentActiveElement = document.activeElement; 
      if(lastActiveElement != currentActiveElement) { 
       lastActiveElement = currentActiveElement; 
       return false; 
      } 

      return true; 
     } 

     function detectFocus() { 
      // Add logic to detect focus and to see if it has changed or not from the lastActiveElement. 
     } 

     function attachEvents() { 
      window.addEventListener ? window.addEventListener('focus', detectFocus, true) : window.attachEvent('onfocusout', detectFocus); 

      window.addEventListener ? window.addEventListener('blur', detectBlur, true) : window.attachEvent('onblur', detectBlur); 
     } 

     attachEvents(); 

    </script> 
</body> 
</html> 
1

Secondo la mia esperienza, la migliore fonte di informazioni sui problemi del browser è Quirksmode. Ecco un link all'opzione "ovvia" (ma non utilizzabile): messa a fuoco e sfocatura.

http://www.quirksmode.org/dom/events/blurfocus.html

Stranamente (e sorprendentemente) è browser basati su WebKit che sono l'unico neo qui.

Un'altra opzione consiste nell'utilizzare un timer intervallo per verificare se l'activeElement è stato modificato come unica opzione OPPURE come backup per messa a fuoco/sfocatura. (È anche possibile ascoltare la pressione di tasti, i clic del mouse e i tocchi per verificare se activeElement cambia). Se si coprono queste opzioni, intervalloTimer non avrà quasi mai bisogno di ripulire.

+0

Attualmente sto usando un intervallo, ma ho pensato che la mia ignoranza mi stesse trattenendo. Eppure, cerco da un po 'di tempo e non ho trovato niente di meglio. Se potessi eliminare Flash dal problema, sarebbe più facile. Fonte fantastica, grazie! –

2

Sembra che sia possibile utilizzare una combinazione di cattura di messa a fuoco/sfocatura e focusin/focusout (IE). Qualcosa di simile, forse:

window.addEventListener ? 
    window.addEventListener('blur', blurHappened, true) 
    : window.attachEvent('onfocusout', blurHappened); 

function blurHappened() { 
    console.log('document.activeElement changed'); 
} 

onfocusout cattura bolle "sbavature", mentre regolare blur su addEventListener cattureranno "sfocature".

Potrebbe essere necessario aggiungere ulteriori controlli in blurHappened. Non sono sicuro come non ho provato.

Problemi correlati