javascript - 如何从 jQuery 访问框架(非 iframe)内容

标签 javascript jquery html frame

我在一个页面中有 2 个框架,如下所示 (home.html)

<frameset rows="50%, 50%">
        <frame id="treeContent" src="treeContent.html" />
        <frame id="treeStatus"  src="treeStatus.html" />
</frameset>

然后在一帧中(treeStatus.html)我有类似的东西

<body style="margin: 0px">
<div id="statusText">Status bar for Tree</div>
</body>

我想从顶部窗口通过jquery操作位于子框架中的div(例如显示和隐藏)。

我见过several questions like this他们提出以下建议

$(document).ready(function(){

            $('#treeStatus').contents().find("#statusText").hide();
     });

我不知道这是否适用于 iframe,但在我有简单框架的情况下,它似乎不起作用。代码放在home.html里面

这是 Firebug 控制台的一些输出

>>> $('#treeStatus')
[frame#treeStatus]
>>> $('#treeStatus').contents()
[]
>>> $('#treeStatus').children()
[]

那么如何从顶部框架访问框架元素呢?我在这里遗漏了什么吗?

回答

将两个答案合并后,正确的方法是

$('#statusText',top.frames["treeStatus"].document).hide();

为此,框架除了 id 之外还必须具有 name 属性,如下所示:

<frameset rows="50%, 50%">
            <frame id="treeContent" src="treeContent.html" />
            <frame name="treeStatus" id="treeStatus"  src="treeStatus.html" />
    </frameset>

最佳答案

您可以抓取您想要操作的 Frame 和 div 并将其传递到变量中。

var statusText = top.frames["treeStatus"].document.getElementById('statusText');

然后你可以通过 jQuery 做任何你想做的事情。

$(statusText).whatever();

尽管有时您无法避免使用框架,但请记住 <frame>标签在 HTML5 中已被废弃。如果您计划升级到 HTML5,则必须使用 iFrame。

关于javascript - 如何从 jQuery 访问框架(非 iframe)内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14054349/

相关文章:

c# - 从服务器或客户端检查或更改键盘输入语言

javascript - 将 $scope 传递给 angularJs 服务/工厂是个坏主意吗?

javascript - 从 lQuery ajax 请求获取进度条的部分响应?

ruby-on-rails - 我应该在哪个 HTML5 标签中包装 Rails flash 通知?

javascript - HTML5 Canvas(绘图(矩形)不断消失)

javascript - 如何最小化 JavaScript 事件

javascript - 同一页面上的 jQuery 和 javascript 代码不起作用

javascript - 叠加关闭

JQuery 在集合中选择

javascript - Cloud Functions 写入 Firebase 实时数据库超时