Jak wyczyścić fokus w javascript?

159

Wiem, że to nie powinno być takie trudne, ale nie mogłem znaleźć odpowiedzi w Google.

Chcę wykonać skrypt javascript, który usunie fokus z dowolnego elementu, na którym się znajduje, bez wcześniejszej wiedzy, na którym elemencie jest fokus. Musi działać na Firefox 2, a także na nowszych przeglądarkach.

Czy jest na to dobry sposób?

Andres
źródło
co to znaczy jasne skupienie? - czy to to samo co rozmycie?
plodder
3
Chcę, aby żaden element w przeglądarce nie był aktywny.
Andres

Odpowiedzi:

170

Odpowiedź: document.activeElement

Aby robić, co chcesz, użyj document.activeElement.blur()

Jeśli potrzebujesz obsługi przeglądarki Firefox 2, możesz również użyć tego:

function onElementFocused(e)
{
    if (e && e.target)
        document.activeElement = e.target == document ? null : e.target;
} 

if (document.addEventListener) 
    document.addEventListener("focus", onElementFocused, true);
jps
źródło
8
Jeśli Firefox 2, z 0,66% udziału w przeglądarce, przełamie umowę ... Mam poprawkę, która znajduje się w mojej edytowanej odpowiedzi.
jps
21
W 2013 roku udział przeglądarek Firefox 2 był znacznie mniejszy niż 0,66%, a najprostszy sposób document.activeElement.blur()jest najlepszym sposobem na osiągnięcie tego efektu.
chowey
88

.focus()a potem .blur()coś innego na twojej stronie. Ponieważ tylko jeden element może mieć fokus, jest on przenoszony do tego elementu, a następnie usuwany.

Kevin Reid
źródło
Czy istnieje sposób na stworzenie niewidzialnego elementu, który ma skupienie?
Andres
1
Nie jestem ekspertem w kwestii najlepszego sposobu na zrobienie tego; ale z pewnością możesz umieścić go poza ekranem lub poza granicami overflow: clipstylizowanego elementu. Ale możesz po prostu użyć pola, które już istnieje na stronie. Lub utwórz go tylko w tym celu i usuń go ponownie.
Kevin Reid
Myślę, że ustawienie fokusu na element poza ekranem wymusi przewinięcie do tego elementu. Możesz jednak w tym celu utworzyć niewidoczny element. Biorąc to pod uwagę, niektóre przeglądarki mogą mieć trudności z usunięciem znaku. Po prostu rozmycie () prawdopodobnie działałoby lepiej. Nadal można uzyskać klucze za pomocą programu obsługi zdarzeń keyup (keydown).
Alexis Wilke
5
Ta odpowiedź jest nieaktualna i nie ma zastosowania w roku 2017. Zamiast tego użyj activeElement, jak na stackoverflow.com/a/2520670/39808
Paul Fisher
Nadal działa, tylko dłużej i przenosi fokus (co może kolidować z nawigacją za pomocą TAB). Ponadto nie jest od razu jasne, co powinno być „czymś innym arbitralnym”.
user202729
49
document.activeElement.blur();

Działa nieprawidłowo w IE9 - rozmywa całe okno przeglądarki, jeśli aktywnym elementem jest treść dokumentu. Lepiej sprawdzić w tym przypadku:

if (document.activeElement != document.body) document.activeElement.blur();
pwnzor1337
źródło
To prawda, ale dziś prawie nikt nie używa już IE9.
Kaczor Donald
18

Żadna z udzielonych tutaj odpowiedzi nie jest całkowicie poprawna w przypadku korzystania z języka TypeScript, ponieważ możesz nie znać rodzaju wybranego elementu.

Byłoby to zatem preferowane:

if (document.activeElement instanceof HTMLElement)
    document.activeElement.blur();

Ponadto odradzam skorzystanie z rozwiązania podanego w zaakceptowanej odpowiedzi, ponieważ wynikające z tego rozmycie nie jest częścią oficjalnej specyfikacji i może się zepsuć w dowolnym momencie.

wilcobrouwer
źródło
6
Fajnie jest widzieć, jak pytanie, które zadałem w 2010 roku, wciąż ma ewoluującą odpowiedź.
Andres
2

dummyElem.focus () gdzie dummyElem jest ukrytym obiektem (np. ma ujemny zIndex)?

kujon
źródło
0

Możesz wywołać window.focus ();

ale przesuwanie lub utrata fokusu z pewnością przeszkadza każdemu, kto używa klawisza Tab do poruszania się po stronie.

można było nasłuchiwać kodu 13 i zrezygnować z efektu naciśnięcia klawisza tabulatora.

kennebec
źródło
-3

Dzięki jQuery po prostu: $(this).blur();

bsbak
źródło
2
To stara odpowiedź, więc być może już wiesz, ale są dwa powody, dla których ta odpowiedź nie ma zastosowania. 1. Zakłada się, że PO korzystał z jquery, 2. thismusi być elementem ukierunkowanym, podczas gdy pytanie wyraźnie stwierdza, że ​​PO nie zna z wyprzedzeniem tego elementu.
Brandon,