javascript - 使用 jQuery 将监听器附加到 iframe 内的顶部窗口焦点事件

标签 javascript jquery

有没有办法在 iFrame 中附加一个监听器,当浏览器窗口获得焦点(点击标签或标题栏)时将调用该监听器?这是测试代码:

测试.html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><body><iframe src="test1.html"></iframe></body></html>

test1.html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script></head><body><script type="text/javascript">
    var doc = $(window.top.document);
    var win = $(window.top);
    doc.ready(function(){
             win.focus(function() { console.log('Focus'); });
             win.blur(function() { console.log('Blur'); });
             doc.mousemove(function() { console.log('Move'); });
    });
</script></body></html>

点击 test.html,mousemove 监听器被调用,但 focus 和 blur 仅在 iFrame 被点击和关闭时被调用,而不是在浏览器窗口获得/失去焦点时被调用。我已经尝试将监听器附加到文档并以相同的结果获胜。我正在 Chrome 和 Firefox 中进行测试。

最佳答案

我真的不知道,jQuery 的 focus/blur 有什么魔力,但我相信这个魔力有点 bug。 (或者这可能是我不知道的功能 :o)

如果您不使用 jQuery 方法来执行它,它工作正常。

var doc = window.top.document;
var win = window.top;
win.onfocus = function() { console.log('Focus'); };
win.onblur  = function() { console.log('Blur'); };
doc.onmousemove = function() { console.log('Move'); };

关于javascript - 使用 jQuery 将监听器附加到 iframe 内的顶部窗口焦点事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12325519/

相关文章:

jquery - 两个版本的Jquery冲突

javascript - 如果单击单选按钮激活输入并获取值

Jquery、ajax() 和each(),如何等到所有信息真正加载完毕?

javascript - jQuery Lazy 插件 - 一次加载所有图像

javascript - Dart `startsWith` 是否比 JavaScript 中的相同方法慢?

javascript - Node Sequelize - 插入日期 "as is"而不转换为 UTC

javascript - 如何通过从 canvasjs 中的 AJAX 调用获取输入来绘制具有对数刻度的图形

javascript - 类型错误 : Cannot read property 'field1' of undefined?

javascript - 为什么我的 jQuery AJAX 函数总是返回 false?

jquery - 如何使用 JQuery 选择没有特定子元素的元素