如何从jQuery访问框架（非iframe）内容
[英]How to access frame (not iframe) contents from jQuery
问题描述
I have 2 frames in one page like this ( home.html ) 
我在这样的一页中有2帧（ home.html ）
<frameset rows="50%, 50%">
<frame id="treeContent" src="treeContent.html" />
<frame id="treeStatus" src="treeStatus.html" />
</frameset>
and then in one frame ( treeStatus.html ) I have something like 然后在一帧（ treeStatus.html ）中我有类似
<body style="margin: 0px">
<div id="statusText">Status bar for Tree</div>
</body>
I want from the top window to manipulate the div located in the child frame via jquery (eg show and hide). 我想从顶部窗口通过jquery操作位于子框架中的div（例如，显示和隐藏）。
I have seen several questions like this and they suggest the following 我见过几个 问题， 像 这样 ，他们提出以下
$(document).ready(function(){
$('#treeStatus').contents().find("#statusText").hide();
});
I do not know if this works with iframes but in my case where I have simple frames it does not seem to work. 我不知道这是否适用于iframe，但在我拥有简单框架的情况下，它似乎不起作用。 The code is placed inside home.html 该代码位于home.html中
Here is some output from firebug console 这是firebug控制台的一些输出
>>> $('#treeStatus')
[frame#treeStatus]
>>> $('#treeStatus').contents()
[]
>>> $('#treeStatus').children()
[]
So how do I access frame elements from the top frame? 那么如何从顶部框架访问框架元素？ Am I missing something here? 我在这里想念什么吗？
Answer 回答
After combining both answers here, the correct way is 合并两个答案后，正确的方法是
$('#statusText',top.frames["treeStatus"].document).hide();
For this to work the frame must have the name attribute apart from the id, like this: 为此，框架必须具有id之外的name属性，如下所示：
<frameset rows="50%, 50%">
<frame id="treeContent" src="treeContent.html" />
<frame name="treeStatus" id="treeStatus" src="treeStatus.html" />
</frameset>
5 个解决方案
解决方案1
12 已采纳 2010-05-27 14:36:22
You could grab the Frame and div you are wanting to manipulate and pass it into a variable. 您可以抓取要操纵的Frame和div并将其传递给变量。
var statusText = top.frames["treeStatus"].document.getElementById('statusText');
Then you can do anything you want to it through jQuery. 然后，您可以通过jQuery做任何您想做的事情。
$(statusText).whatever();
Though sometimes you just can't get around having to use frames, keep in mind that the <frame> tag is obsoleted in HTML5. 尽管有时您只是无法使用框架，但请记住， <frame>标记在HTML5中已过时。 If you ever plan on moving up to HTML5, you'll have to use iFrames. 如果您打算升级到HTML5，则必须使用iFrame。
解决方案2
5 2013-02-25 15:02:39
I have nested frames. 我有嵌套的框架。 In my case, to make it work i used command: 就我而言，要使其正常工作，我使用了命令：
var statusText =
top.document.getElementById("treeStatus").contentDocument.getElementById("statusText");
Then, as Charles already answered, you can do anything you want to it through jQuery: 然后，正如Charles已经回答的那样，您可以通过jQuery做任何您想做的事情：
$(statusText).whatever();
解决方案3
5 2010-05-27 14:30:04
您需要提供对要访问的框架的参考：
$("some selector", top.frames["treeStatus"]))
解决方案4
2 2015-11-16 07:24:03
https://jamesmccaffrey.wordpress.com/2009/07/30/cross-frame-access-with-jquery/ https://jamesmccaffrey.wordpress.com/2009/07/30/cross-frame-access-with-jquery/
$(document).ready(function(){
$("#Button1").click(function(){
$(parent.rightFrame.document).contents().find(‘#TextBox1’).val(‘Hello from left frame!’);
});
});
But I used : 但是我用过：
$.post("content_right.php",{id:id},function(data)
$(parent.frames["content_right"].document.body).html(data) ;
});
解决方案5
2 2016-01-05 18:52:51
For a pure jquery solution (that doesn't require top.frames etc), the following seems to work: 对于纯jquery解决方案（不需要top.frames等），似乎可以使用以下方法：
$('some selector for item from frame' ,$('frame selector')[0].contentDocument)
This has the advantage that it works for nested frames: 这具有可用于嵌套框架的优点：
$('inner frame item selector', $('inner frame selector', $('outer frame selector')[0].contentDocument)[0].contentDocument)
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.