Jak ustalić, gdzie nastąpiło skupienie?

Question

Zostało to wcześniej zadane here, ale kilka lat temu i nie było wtedy rozwiązania wieloplatformowego (inne niż rozwiązanie setTimeout, które jest naprawdę niezbyt przydatne).

Chciałbym zrobić onblur="foo(parm);" i mieć foo być w stanie określić, który element ma teraz fokus.

Używam zwykłego javascript; nie jQuery dla tego, proszę.

Czy to możliwe w dzisiejszych czasach?

Answer 1

Można spróbować czegoś takiego:

function whereDidYouGo() { 
    var all = document.getElementsByTagName('*'); 

     for (var i = 0; i < all.length; i++) 
      if (all[i] === all[i].ownerDocument.activeElement) 
       return all[i]; 
} 

EDIT:

function whereDidYouGo() { return document.activeElement; } 

Answer 2

w jQuery, na wniosek OP:

$(':input').blur(function() { 
    $focusedElement = $(':input:focus'); 
    //Do stuff with $focusedElement 
} 

Answer 3

ciekawe pytanie. Najważniejsze w tej sprawie jest - kiedy ma miejsce zdarzenie "fokus", przed lub po zdarzeniu? Jeśli uruchomi się przed zdarzeniem, problem jest prosty, ponieważ możesz zapisać bieżący fokus w zmiennej, do której zdarzenie blur może uzyskać dostęp.

Jednak, przynajmniej w przeglądarce Chrome 13, zdarzenie blur pojawia się przed zdarzenia fokusa. Jedno możliwe rozwiązanie.

Biorąc pod uwagę następujące HTML:

<input id="foo" value='foo' /> 
<input id="bar" value='bar' /> 

Następnie można:

var currentFocus; 
var pendingBlur; 

var foo = document.getElementById('foo'); 
foo.addEventListener('focus', function(){ 
    currentFocus = foo; 
    if(pendingBlur !== undefined){ 
     pendingBlur(); 
     pendingBlur = undefined; 
    } 
}); 
foo.addEventListener('blur', function(){ 
    pendingBlur = function(){ 
     console.log('new focus:', currentFocus); 
    }; 
}); 

var bar= document.getElementById('bar'); 
bar.addEventListener('focus', function(){ 
    currentFocus = bar; 
    if(pendingBlur !== undefined){ 
     pendingBlur(); 
     pendingBlur = undefined; 
    } 
}); 
bar.addEventListener('blur', function(){ 
    pendingBlur = function(){ 
     console.log('new focus:', currentFocus); 
    }; 
}); 

Zasadniczo, po prostu nie jest zwrotna rozmycie więc jest przydatny dla zdarzenia ostrości zadzwonić po wiemy o których element był skupiony.

Oto working example na JSFiddle.

EDIT: To rozwiązanie cierpi na problem, że jeśli plama na formularzu, klikając na coś inne niż innego elementu formularza, zdarzenie plama nie odpala (ponieważ czekamy na imprezy focus). Jedynym sposobem, który mogę sobie wyobrazić, jest użycie licznika czasu, aby sprawdzić, czy jest zdefiniowany element oczekującyBlur, a jeśli tak, to zadzwoń. W tym momencie naprawdę nie potrzebujesz zdarzenia fokusowania, aby wywołać zwrotne wywołanie rozmycia ...