jquery iframe 正文选择器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4955076/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery iframe body selector
提问by Jinbom Heo
is there simple expression to access iframe body using jquery. assume iframe's id is theframe.
是否有使用 jquery 访问 iframe 正文的简单表达式。假设 iframe 的 id 是 theframe。
I want to give event handler to iframe. for example,
我想为 iframe 提供事件处理程序。例如，
$("#theframe").contents().find("body").click(function() {
alert("hello, you touched me~");
});
but, this code doesn't work in IE.
但是，此代码在 IE 中不起作用。
any alternative idea help me~
任何替代想法帮助我~
回答by aorcsik
Give a name property for the iframe element. Now you can reference it like this:
为 iframe 元素指定名称属性。现在你可以像这样引用它：
window.name_of_iframe
Your iframe may not have jQuery so, using standard traversing is a safer way
您的 iframe 可能没有 jQuery，因此使用标准遍历是一种更安全的方法
iframe_body = window.name_of_iframe.document.getElementsByTagName("body")[0];
This will be the body element in the iframe. This is however usable by jQuery on the host page, so:
这将是 iframe 中的 body 元素。但是，这可以在主机页面上由 jQuery 使用，因此：
$(window.name_of_iframe.document.getElementsByTagName("body")[0]);
is your jQuery wrapper for the iframe's body element.
是 iframe 的 body 元素的 jQuery 包装器。
Be careful to do this only if the iframe is loaded:
只有在加载 iframe 时才小心执行此操作：
$("iframe[name=name_of_iframe]").load(function() {
var iframe_body = window.name_of_iframe.document.getElementsByTagName("body")[0];
$(iframe_body).click(function() {
alert("hello, you touched me~");
});
});
UPDATE:tested it in IE, and there is a rather starnge behaviour with it. In firefox you have to wrap it inside a document ready event, but in IE, it has to be outside, right after the iframe element. This version works in IE and Firefox too.
更新：在 IE 中测试过它，它有一个相当严重的行为。在 Firefox 中，您必须将其包装在文档就绪事件中，但在 IE 中，它必须位于外部，紧跟在 iframe 元素之后。此版本也适用于 IE 和 Firefox。
<iframe name="ifr" src="?if=1"></iframe>
<script type="text/javascript">
var ifr_loaded = false;
$("iframe").load(function() {
$(window.ifr.document.getElementsByTagName("body")[0]).click(function() { alert("s"); });
ifr_loaded = true;
});
$(function() {
if (!ifr_loaded)
{
$("iframe").load(function() {
$(window.ifr.document.getElementsByTagName("body")[0]).click(function() { alert("d"); });
});
}
});
</script>
UPDATE 2:a shorter version, but it has its drawback, that you have to specify the source of the iframe in the javascript, but it works in all browsers I tried.
更新 2：一个较短的版本，但它有它的缺点，你必须在 javascript 中指定 iframe 的来源，但它适用于我尝试过的所有浏览器。
<iframe name="ifr"></iframe>
<script type="text/javascript">
$(function() {
$("iframe").load(function() {
$(window.ifr.document.getElementsByTagName("body")[0]).click(function() { alert("d"); });
}).attr("src","/teszt/v/index.php?if=1");
});
</script>
UPDATE 3:And an even simpler way for the end:
更新 3：最后还有一种更简单的方法：
<script type="text/javascript">
function init_iframe(obj) {
$(obj.document.getElementsByTagName("body")[0]).click(function() { alert("d"); });
}
</script>
<iframe name="ifr" src="?if=1" onload="init_iframe(window.ifr);"></iframe>
