これはそれほど難しくないはずですが、Googleで答えを見つけることができませんでした。
フォーカスがどの要素にあるのかを事前に知ることなく、フォーカスしている要素からフォーカスをクリアするjavascriptを実行したいと思います。 firefox 2および最新のブラウザで動作する必要があります。
これを行う良い方法はありますか?
---編集----
技術的に: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);
.focus()
に続いて.blur()
ページ上の任意の何か。 1つの要素のみがフォーカスを持つことができるため、その要素に転送されてから削除されます。
document.activeElement.blur();
IE9では正しく動作しません-アクティブな要素がドキュメント本文の場合、ブラウザウィンドウ全体がぼやけます。このケースを確認する方が良い:
if (document.activeElement != document.body) document.activeElement.blur();
選択された要素の種類がわからない場合があるため、TypeScriptを使用する場合、ここで提供される回答はどれも完全に正しいものではありません。
したがって、これが優先されます。
if (document.activeElement instanceof HTMLElement)
document.activeElement.blur();
さらに、結果として生じるぼかしは公式の仕様の一部ではなく、いつでも壊れる可能性があるため、受け入れられた回答で提供されているソリューションを使用することをお勧めしません。
dummyElem.focus()ここで、dummyElemは隠されたオブジェクトです(例えば、負のzIndexを持っています)?
Window.focus();を呼び出すことができます。
ただし、フォーカスを移動したり失ったりすると、タブキーを使用してページ内を移動するユーザーの邪魔になります。
キーコード13をリッスンし、タブキーが押された場合の効果を無視できます。
要素に「アクティブな」クラスを含むトップメニューがある場合は、それを使用できます。
$(".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>