var iframe = $('#iframe').contents();
iframe.find("#button").click(function(){
//write code to close the popup
});
上述过程可以总结如下
$('#iframe').load(function(){
var iframe = $('#iframe').contents();
iframe.find("#button").click(function(){
$('#popup').close() //May depend on your popup implementation
});
});
window.addEventListener('message',receiveMessage,false);
function receiveMessage(event){
var origin = event.origin || event.originalEvent.origin;
if(origin.indexOf('http://example-iframe.com')>=0) // check if message received from intended sender
{
if(event.data=="intended message format") // check if data received is in correct format
{
// call functionality that closes popup containing iframe
}else{ // data received is malacious
return;
}
}else{ // message is not received from intended sender
return;
}
}
3条答案
按热度按时间nwsw7zdq1#
使用 AJAX 调用iframe的src来获取其内容,并将其作为站点的一部分呈现(然后可以挂钩)。
您不能直接访问来自不同域的iframe的内容,因为这会违反安全性。
pu3pd22g2#
如果我没理解错你的要求
您可以添加一个
$('#iframe').load(function(){}
,它将监视iframe到DOM中的加载。加载iframe后,您可以将事件侦听器附加到按钮单击
上述过程可以总结如下
这里的问题是同源策略阻止脚本访问其他来源的网站内容。实际上,来源包括以下几个部分。
如果协议、主机名和端口号不相同,则认为来源不同。
在这种情况下,由于同源安全策略,您无法从其他网站访问一个网站的内容。
为了克服这个问题,您必须使用
window.postMessage()
进行父子通信。仅供参考:https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage。
**Window.postMessage()**方法可以安全地启用跨源通信。
假设你的父网站是
example-parent.com
,在Iframe中你的加载网站是example-iframe.com
,让两者都使用http协议。下面是我如何解决这个问题的。在父网站中添加事件监听器来接收消息,如下所示。从Iframe向上级网站发布消息如下。发布消息语法:
otherWindow.postMessage(message, targetOrigin, [transfer]);
正确使用postMessage(),否则可能导致跨站脚本攻击。
8cdiaqws3#
我很抱歉告诉你,但是,你不能。因为这将违反CORS(跨源资源共享)的规则,浏览器已经设置,它不会让你打破这些。因为它的全能。
它将在您的控制台中给予错误“Access-Control-Allow-Origin”。
希望对你有帮助。
不过,如果你想在你的网站上做点什么,你可以问下面,我可能会给予你一个替代这样做。