我知道同源政策......只是把它弄清楚了。
无论如何，我有一个幻灯片 (slide.js)，里面有一些嵌入式视频。当用户点击视频时，我希望幻灯片暂停。来自 iframe 内部的事件不会触发，所以我正在尝试解决这个问题。现在我有一个部分解决方案。我在 window 上检测到一个 blur 事件，如果新聚焦的元素是一个 iframe，那么我暂停幻灯片放映:
$(window).blur(function(event){
console.log(event.target);
if($('iframe').is(':focus')){
//clicked inside iframe
console.log('test');
}
console.log('document.activeElement is:');
console.log(document.activeElement);
console.log('\n');
});
加载页面后，我在控制台中得到了这个:
document.activeElement is:
BODY
现在是让我困惑的部分。当我首先点击 iframe 以外的地方 时，点击事件只会触发 iframe 焦点事件。也就是说，加载页面后，如果我直接点击iframe，控制台不会记录测试。如果我在框架外、浏览器中的另一个选项卡或其他任何地方单击，blur 事件将触发。之后，如果我单击 iframe，那么我会在控制台中进行测试:
加载页面后，我单击不同的选项卡然后返回到原始选项卡:
Window {top: Window, window: Window, location: Location, external: Object, chrome: Object…}
document.activeElement is:
<body class="full">...</body>
然后我点击 iframe:
Window {top: Window, window: Window, location: Location, external: Object, chrome: Object…}
test
document.activeElement is:
<iframe>...</iframe>
为什么？？？
我什至把它放在一切之前，但没有帮助:
$(window).focus();
但是，如果我这样做，它会起作用:
$('input').focus();
如果输入获得焦点，那么我可以单击 iframe 并触发事件，而无需事先单击任何其他内容。
帮助我，你是我唯一的希望......
最佳答案
编辑:
实际上，仅使用 native window.focus() 似乎对我有用:
如何仅附加另一个元素以将焦点设置为:
$('<input>', {type: 'text',
style: 'top: -10000px; position: absolute',
autofocus:true}
).appendTo('body')
.focus(); // just to make sure
如果可以的话，我会直接在标记中添加一个具有自动对焦功能的输入元素，这样模糊事件总是在第一次点击时触发。
关于javascript - 触发点击 iframe，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16549869/