我有一个带有 iframe 的页面。在该 iframe 内部,我有如下 JavaScript 函数:
function putme() {}
我怎样在主页面上调用这个函数?
我有一个带有 iframe 的页面。在该 iframe 内部,我有如下 JavaScript 函数:
function putme() {}
我怎样在主页面上调用这个函数?
window.frames['frameName'].putme();
请注意,这通常仅在iframe引用同一域上的页面时才起作用。出于安全原因,浏览器限制访问属于不同域的框架中的页面。
为了更加稳健可靠:
function getIframeWindow(iframe_object) {
var doc;
if (iframe_object.contentWindow) {
return iframe_object.contentWindow;
}
if (iframe_object.window) {
return iframe_object.window;
}
if (!doc && iframe_object.contentDocument) {
doc = iframe_object.contentDocument;
}
if (!doc && iframe_object.document) {
doc = iframe_object.document;
}
if (doc && doc.defaultView) {
return doc.defaultView;
}
if (doc && doc.parentWindow) {
return doc.parentWindow;
}
return undefined;
}
...
var el = document.getElementById('targetFrame');
var frame_win = getIframeWindow(el);
if (frame_win) {
frame_win.putme();
...
}
...
如果iframe与外部页面不在同一个域中,则很难或根本无法访问。
通常,浏览器会阻止javascript从不同域中访问代码,但是如果您控制两个页面,则有一些技巧可以使某些东西起作用。或多或少。
例如,您可以从外部页面更改iFrame的URL片段,从内部iframe轮询该片段并调用该函数。窗口名称也有类似的技巧。
window.[FrameName].putme();
您可以通过名称访问iframe:
foo.putme();
在 iframe 页面内声明的全局函数将成为该 iframe 的 window 对象的成员。您可以使用 iframe 的名称访问 iframe 的 window 对象。
为了使此功能正常工作,您的 iframe 需要具有 name 属性:
<iframe name="foo" ...>
给框架一个名称和一个id - 两者相同。 window.frameNameOrId_.functionName()
两个框架必须在同一个域中(虽然有一定的方法可以绕过此限制)
这可以用JavaScript完成:
window.top.location.href = url;
在所有主要浏览器中完美运行。