Javascript $(window).focus()为每个焦点运行两次
我不知道为什么会发生这种情况,我很想得到一个解释 使用jquery的Javascript $(window).focus()为每个焦点运行两次,javascript,jquery,Javascript,Jquery,我不知道为什么会发生这种情况,我很想得到一个解释 使用jquery的focus方法,我绑定到窗口焦点事件。 这是一个工作示例(将粘贴复制到html文件并在浏览器中打开。由于某些原因,在JSFIDLE或jsbin中不起作用) 在这里: 为什么? $(窗口)。加载(函数(){ $(window.focus(function(){console.log(“focus”);}); $(window.blur(function(){console.log(“blur”);}); }); 当浏览器重新获
focus
方法,我绑定到窗口焦点事件。
这是一个工作示例(将粘贴复制到html文件并在浏览器中打开。由于某些原因,在JSFIDLE或jsbin中不起作用)
在这里:
为什么?
$(窗口)。加载(函数(){
$(window.focus(function(){console.log(“focus”);});
$(window.blur(function(){console.log(“blur”);});
});
当浏览器重新获得焦点时,该功能将运行两次,并在控制台中打印两次“焦点”。
知道为什么会这样吗
顺便说一句,最终目标是在用户离开浏览器进入应用程序或其他选项卡时停止计时器的运行
更新
在chrome的最新(开发)版本上运行。我将在firefox上测试它,并编写它是否与firefox不同
更新2
有趣的事实-firefox上没有。也许这是chrome的一个bug。也许load()
被调用了两次?您可以在不使用.load()
的情况下注册这些事件。试试这个:
<script>
$(window).focus(function() {console.log("focus");});
$(window).blur(function() {console.log("blur");});
</script>
$(window.focus(function(){console.log(“focus”);});
$(window.blur(function(){console.log(“blur”);});
哪个浏览器?对我来说似乎很好
作为预防措施,可以使用javascript变量使其仅运行一次
<script>
var isFocused = false;
$(window).load(function() {
$(window).focus(function() {
if(isFocused)
return;
console.log("focus");
isFocused = true;
});
$(window).blur(function() {
console.log("blur");
isFocused = false;
});
});
</script>
var=false;
$(窗口)。加载(函数(){
$(窗口).focus(函数(){
如果(聚焦)
返回;
控制台日志(“焦点”);
isFocused=true;
});
$(窗口).blur(函数(){
控制台日志(“模糊”);
isFocused=false;
});
});
live()已被弃用。改为使用on()
您可以尝试使用live()函数
$(window.live(“focus”,function(){alert(“focus!”);}) 如果同时使用下划线,则可以使用
.debounce()
方法将重复事件限制为单个事件。我也遇到了同样的问题。我的修复方法是使用lodash的debounce()
函数()。这是我的解决方案:
var debouncedFocus = _.debounce(() => {
console.log('focussed');
}, 250, {leading: true, trailing: false});
$(window).on('focus', debouncedFocus);
这对我有用。您使用的是哪种浏览器?@PhilBooth Chrome(更新了问题)@Derek,正如我所写的-我正在尝试查看浏览器是否处于焦点位置,而不是#这里我想可能是控制台本身d从jQuery 1.7开始,不推荐使用
live()
方法。改用on()
方法:$(document).on(“focus”,function(){console.log(“focus!”);})代码>。看到了吗,但OP不是使用v1.6吗?那样的话,live
应该没问题吧?
$(window).on("focus", function(){ alert("focus!"); });
var debouncedFocus = _.debounce(() => {
console.log('focussed');
}, 250, {leading: true, trailing: false});
$(window).on('focus', debouncedFocus);