web-dev-qa-db-ja.com

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();
});
javascriptjqueryjavascript-eventsfocus
245
xijo

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

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

このような：

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

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

33
NVRAM

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

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

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

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

ぼかしとjsfiddle： http://jsfiddle.net/yznhb8pc/

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

フォーカスアウト付きのjsfiddle： http://jsfiddle.net/yznhb8pc/1/

8
Razan Paul

フィールドがフォーカスされる前に「クールオプション」がビューから隠されている場合は、スクリーンリーダーを使用している人に不要な情報が表示されないように、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();
});
0
Sprose