在代码的某些部分,我有一个关于focusin事件的监听器,另一部分以编程方式将焦点设置在一个input.在Chrome,Safari,Firefox上,事件监听器被调用一次,但在IE(包括IE10)上,它被调用两次.我用jQuery注册了监听器,.on()并用jQuery 设置了焦点.focus().请参阅下面的显示此行为的示例的完整源代码,如果您愿意,可以运行该示例.
focusin两次.并且只有在以编程方式设置焦点时才会这样做,而不是在用户选项卡或单击字段时.为什么?它只是一个IE漏洞,还是IE有这么好的理由?<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(function() {
$('input').on('focusin', function() {
var c = $('#count');
$('#count').text(1 + parseInt(c.text()));
console.log('focusin');
});
$('input').focus();
});
</script>
</head>
<body>
<input>
<code>focusin</code> received: <span id="count">0</span>.
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
这绝对是IE的问题。来自JQuery 1.9 升级指南:
不幸的是,所有版本的 Internet Explorer(6 到 10)都会异步触发焦点事件。当您在 IE 中 .trigger("focus") 时,jQuery 将不会“看到”稍后将发生的异步焦点事件,因此它会触发自己的事件之一以确保焦点事件始终发生,如上所述。这会导致对事件处理程序的两次调用。为了避免这种双重调用(但存在事件处理程序根本不被调用的风险),请直接使用 DOM focus 方法,例如 $("selector").get(0).focus()。
我使用过$('input').get(0).focus(),它在页面加载上不是很一致。如果我将代码移至按钮,那么我就会始终触发事件focusin。