web-dev-qa-db-ja.com

javascriptの焦点をどのようにクリアしますか？

これはそれほど難しくないはずですが、Googleで答えを見つけることができませんでした。

フォーカスがどの要素にあるのかを事前に知ることなく、フォーカスしている要素からフォーカスをクリアするjavascriptを実行したいと思います。 firefox 2および最新のブラウザで動作する必要があります。

これを行う良い方法はありますか？

javascriptfocus
136
Andres

回答： document.activeElement

---編集----

技術的に：document.activeElement.blur()

----編集2 ----

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

if (document.addEventListener) 
    document.addEventListener("focus", onElementFocused, true);
143
jps

.focus()に続いて.blur()ページ上の任意の何か。 1つの要素のみがフォーカスを持つことができるため、その要素に転送されてから削除されます。

85
Kevin Reid
document.activeElement.blur();

IE9では正しく動作しません-アクティブな要素がドキュメント本文の場合、ブラウザウィンドウ全体がぼやけます。このケースを確認する方が良い：

if (document.activeElement != document.body) document.activeElement.blur();
44
pwnzor1337

選択された要素の種類がわからない場合があるため、TypeScriptを使用する場合、ここで提供される回答はどれも完全に正しいものではありません。

したがって、これが優先されます。

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

さらに、結果として生じるぼかしは公式の仕様の一部ではなく、いつでも壊れる可能性があるため、受け入れられた回答で提供されているソリューションを使用することをお勧めしません。

3
user2976450

dummyElem.focus（）ここで、dummyElemは隠されたオブジェクトです（例えば、負のzIndexを持っています）？

3
plodder

Window.focus（）;を呼び出すことができます。

ただし、フォーカスを移動したり失ったりすると、タブキーを使用してページ内を移動するユーザーの邪魔になります。

キーコード13をリッスンし、タブキーが押された場合の効果を無視できます。

1
kennebec

要素に「アクティブな」クラスを含むトップメニューがある場合は、それを使用できます。

$(".menu-header:first").find(".active").focus();

次のようなメニュースタイルで機能します。

<div class="menu-header" data-bind="invisible:isVisible">
                <ul class="nav navbar-nav navbar-header">
                    <li><a class="nv" href="/Home" id="home-menu"><span><i class="fa fa-home"></i></span>Hjem</a></li>
                    <li><a class="nv active" href="/nb-no/CV" id="cv-menu"><span><i class="fa fa-pencil-square-o"></i></span>CV</a></li>
                    <li><a class="nv" href="/myjobapps" id="app-menu"><span><i class="fa fa-files-o"></i></span>Søknader</a></li>
                    <li><a class="nv" href="/alladverts" id="jobs-menu"><span><i class="fa fa-search"></i></span>Jobber</a></li>
                    <li><a class="nv" href="/Options" id="option-menu"><span><i class="fa fa-Ellipsis-h"></i></span>Mer</a></li>
                </ul>
            </div>
0
Md. Tazbir Ur Rahman Bhuiyan