访问框架内的框架 [英] Accessing a frame within a frame
问题描述
这是基本设置...是的，所有文档都来自同一个域，但我只能添加代码到主文档。 doc3框架是动态创建的。第一个框架有一个类，但没有名称，第二个只有一个id ...我不知道绑定是否适用于内框架，但firebug不给我任何错误。
哦，我也试过注入一个样式表，但没有成功。
主文档访问doc3）
< html>
< head>
< script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js>< / script>
< script type =text / javascript>
$（document）.ready（function（）{
$（'iframe'）。bind（'load'，function（）{
$（this）.contents （'body'）。css（{'background-color'：'＃333333'，'color'：'＃ddd'}）; //这改变了doc2颜色
$（this）.contents .find（'iframe＃doc3'）。bind（'load'，function（）{
$（this）.contents（）。find（'body'）。css（{'background-color'：' ＃333333'，'color'：'＃ddd'}）; //无效{
}）
}）
}）
< / script>
< / head>
< body>
文件＃1
< iframe class =postFramesrc =doc2.htmwidth =100％ =300>
< / body>
< / html>
doc2.htm
< html>
< head>
< / head>
< body>
< form id =form1>
Document＃2
< iframe id =doc3src =doc3.htmwidth =100％height =250>
< / form>
< / body>
< / html>
doc3.htm
< html>
< head>
< / head>
< body style =background-color：#fff; color：＃000;> <！ - 访问此主体样式 - >
文档＃3
< / body>
< / html>
我希望我说得很清楚。非常感谢任何帮助或正确方向的一个点：）
编辑：更新了主文档与Wahnfrieden的建议（谢谢！），但可惜我仍然无法访问doc3.htm
假设您的iframe都在同一个域中，请执行此操作：
$（function（）{
$（window）.load（function（）{
var iframe2body = $ （'iframe'）。contents（）。find（'body'）;
iframe2body.css（{'background-color'：'＃333333'，'color'：'#ddd'}） doc2 colors
iframe2body.contents（'iframe'）。contents（）。find（'body'）。css（{'background-color'：'#fff'，'color'：'#ddd'}） ; // doc3 colors
}）
}）
链接它一起纯粹为了可读性目的和对于IE我不得不改为 $（window）.load（function（）{
Ok, here is the situation. I have a site that I subscribe to that lets you add your own code, etc. They have a forum editor that I am unable to skin to match my site, so I'd like to just change the colors of the inner most frame (doc3 in the example below).
Here is the basic setup... yes, all documents are from within the same domain but I can only add code to the main document. The doc3 frame is created dynamically. The first frame has a class but no name, the second only has an id... I don't know if the bind works for the inner frame, but firebug isn't giving me any errors.
Oh, and I have tried injecting a stylesheet as well without success.
Main document (with my attempts at accessing doc3)
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('iframe').bind('load', function(){
$(this).contents().find('body').css({'background-color':'#333333','color':'#ddd'}); // This does change doc2 colors
$(this).contents().find('iframe#doc3').bind('load', function(){
$(this).contents().find('body').css({'background-color':'#333333','color':'#ddd'}); // doesn't work :(
})
})
})
</script>
</head>
<body>
Document #1
<iframe class="postFrame" src="doc2.htm" width="100%" height="300">
</body>
</html>
doc2.htm
<html>
<head>
</head>
<body>
<form id="form1">
Document #2
<iframe id="doc3" src="doc3.htm" width="100%" height="250">
</form>
</body>
</html>
doc3.htm
<html>
<head>
</head>
<body style="background-color:#fff; color:#000;"> <!-- access this body style -->
Document #3
</body>
</html>
I hope I made this clear enough. Any help or a point in the right direction would be greatly appreciated :)
Edit: updated the Main document with the suggestion from Wahnfrieden (thanks!), but sadly I still can't get to doc3.htm
Assuming your iframes are all on the same domain give this a shot:
$(function() {
$(window).load(function() {
var iframe2body = $('iframe').contents().find('body');
iframe2body.css({ 'background-color': '#333333', 'color': '#ddd' }); // doc2 colors
iframe2body.contents('iframe').contents().find('body').css({ 'background-color': '#fff', 'color': '#ddd' }); // doc3 colors
})
})
I didn't chain it ALL together purely for readability purposes and for IE I had to change it to $(window).load(function() {
这篇关于访问框架内的框架的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
