有人可以通过一个简单的例子告诉我blur
和focusout
,focus
和focusin
之间的区别吗?
答案 0 :(得分:53)
focusin
和focusout
事件气泡,focus
和blur
事件没有。这意味着您可以在表单字段的父元素上使用focusin
和focusout
。
HTML:
<div class="parent">
<input type="text" />
</div>
<div class="log"></div>
使用Javascript:
$('.parent')
.focusin(function(){log('div focusin');})
.focusout(function(){log('div focusout');})
.focus(function(){log('div focus');})
.blur(function(){log('div blur');});
$('input')
.focusin(function(){log('input focusin');})
.focusout(function(){log('input focusout');})
.focus(function(){log('input focus');})
.blur(function(){log('input blur');});
function log(str){
$('.log').append($('<div/>').text(str));
}
当您运行它时,您会看到只有输入才能获取所有事件,父级只会获得focusin
和focusout
个事件。
答案 1 :(得分:10)
焦点和模糊事件会跟踪用户关注的元素。
焦点
当可聚焦元素获得焦点时触发
模糊
当可聚焦元素失去焦点时触发
关注焦点和焦点
在焦点和模糊的同时开火,但是泡沫。