使用 JQuery 将事件处理程序添加到 iframe

Posted 2023-05-09

【中文标题】使用 JQuery 将事件处理程序添加到 iframe

【英文标题】：Adding event handler to an iframe using JQuery

【发布时间】：2010-10-07 15:53:17

【问题描述】：

我想为 iframe 分配一个 keydown 事件处理程序。类似于纯JS的东西：

document.getElementById('iframe_id').contentWindow.addEventListener('keydown',funcName, true);

我试过了：

$(document.getElementById('iframe_id').contentWindow).keydown( function() 
   // my func
);

但它不起作用..请帮助！

【问题讨论】：

keydown event on a iframe的可能重复

【参考方案1】：

contentWindow 是iframe 的window 对象。你想要iframe 的document 代替：

$(document.getElementById('iframe_id').contentWindow.document).keydown(function() 
    // my func
);

请注意，我不确定 jQuery 如何对来自其他窗口/框架的元素做出反应。

【讨论】：

对此保持警惕。我相信这会导致相当大的内存泄漏，即使您更改其 URL，iframe 的内容仍将保留在内存中。

【参考方案2】：

请记住：据我所知，如果 iframe 内容是跨域的，这将永远不会起作用。您最终会遇到权限错误：http://... 的权限被拒绝以从http://... 获取属性 htmlDocument.nodeType。浏览器将父子 dom 权限限制在同一个域中。

【参考方案3】：

$函数代替了对document.getElementById的需要

$('iframe_id').contentDocument.keydown(function() 
   // logic
);

【参考方案4】：

这对我有用：

$('#iframe_id').contents().keydown(function() 
    // my func
);