jQuery失去焦点事件-Java 学习之路

244

我试图在输入字段获得焦点时显示容器 - 这是实际问题 - 如果焦点丢失则隐藏容器 . 是否存在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();
});

5 回答

7
当元素失去焦点时，使用blur事件调用函数：
```
$('#filter').blur(function() {
  $('#options').hide();
});
```
回复于 2024-04-24T19:37:49+08:00

像这样：

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

回复于 2024-04-24T19:37:49+08:00

40

使用"blur"：http://docs.jquery.com/Events/blur#fn

回复于 2024-04-24T19:37:49+08:00
404
当元素失去焦点时 blur event: .

focusout event: 当元素或其中的任何元素失去焦点时 .

由于滤镜元素内部没有任何内容，因此在这种情况下，模糊和聚焦都会起作用 .
```
$(function() {
  $('#filter').blur(function() {
    $('#options').hide();
  });
})
```
jsfiddle with blur：http://jsfiddle.net/yznhb8pc/
```
$(function() {
  $('#filter').focusout(function() {
    $('#options').hide();
  });
})
```
jsfiddle with focusout：http://jsfiddle.net/yznhb8pc/1/
回复于 2024-04-24T19:37:49+08:00
33
如果在关注字段之前隐藏了“酷选项”，那么您可能希望在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();
});
```
回复于 2024-04-24T19:37:49+08:00

jQuery失去焦点事件

5 回答

相关问题