it-swarm.com.ru

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();
});
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 with blur: http://jsfiddle.net/yznhb8pc/

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

jsfiddle с фокусом: http://jsfiddle.net/yznhb8pc/1/

8
Razan Paul

Если "Прохладные параметры" скрыты от вида до того, как поле будет сфокусировано, то вы захотите создать его в JQuery вместо того, чтобы иметь его в DOM, чтобы любой, кто использует программу чтения с экрана, не видел ненужной информации. Почему они должны слушать это, когда мы не должны видеть это?

Таким образом, вы можете настроить переменные следующим образом:

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