jQueryがフォーカスイベントを失う

入力フィールドがフォーカスを取得した場合にコンテナーを表示し、フォーカスが失われた場合はコンテナーを非表示にしようとしています。これが実際の問題です。jQueryに焦点を当てた反対のイベントはありますか？

いくつかのサンプルコード：

<input type="text" value="" name="filter" id="filter"/>

<div id="options">some cool options</div>

<script type="text/javascript">
  $('#options').hide();

  $('#filter').focus(function() {
    $('#options').appear();
  });
</script>

そして、私がしたいのは次のようなものです：

$('#filter').focus_lost(function() {
  $('#options').hide();
});

要素がフォーカスを失ったときに、blurイベントを使用して関数を呼び出します。

$('#filter').blur(function() {
  $('#options').hide();
});

このような：

$(selector).focusout(function () {
    //Your Code
});

「ぼかし」を使用：http : //docs.jquery.com/Events/blur#fn

ぼかしイベント：要素がフォーカスを失ったとき。

focusoutイベント：要素またはその内部の要素がフォーカスを失ったとき。

フィルター要素の内部には何もないため、この場合はぼかしとフォーカスアウトの両方が機能します。

$(function() {
  $('#filter').blur(function() {
    $('#options').hide();
  });
})

ぼかしのあるjsfiddle：http ://jsfiddle.net/yznhb8pc/

$(function() {
  $('#filter').focusout(function() {
    $('#options').hide();
  });
})

focusout付きのjsfiddle：http ://jsfiddle.net/yznhb8pc/1/

フィールドがフォーカスされる前に 'Cool Options'がビューから非表示になっている場合は、スクリーンリーダーを使用している人に不要な情報が表示されないように、DOMでなく、JQueryで作成することをお勧めします。私たちがそれを見る必要がないとき、なぜ彼らはそれを聞く必要があるのでしょうか？

したがって、次のように変数を設定できます。

var $coolOptions= $("<div id='options'></div>").text("Some cool options");

フォーカスに追加（または追加）します

$("input[name='input_name']").focus(function() {
    $(this).append($coolOptions);
});

フォーカスが終了したら削除します

$("input[name='input_name']").focusout(function() {
    $('#options').remove();
});