使用按钮关闭 iframe 模式
Close iframe modal with button
我正在使用以下内容从书签加载iframe:
javascript:(function(d){
var%20modal=document.createElement('iframe');
modal.setAttribute('src','http://myurl.com/page.html?url=
'+encodeURIComponent(window.location.href)+'&
page_title='+document.title);
modal.setAttribute('scrolling','no');
modal.className='modal';
document.body.appendChild(modal);
var c=document.createElement('link');
c.type='text/css';
c.rel='stylesheet';
c.href='//myurl.com/css/wl_iframe.css';
document.body.appendChild(c);
}(document));
为了关闭它,我正在尝试:
<button onclick="parent.$.iframe.close();">X Close Window</button>
我也试过:
<button onclick="modal.$.iframe.close();">X Close Window</button>
但他们没有工作,他们什么都不做。
我知道我可以使用:
<a href="underneath url" target="_parent">X Close Window</a>
但这会导致浏览器重新刷新他们正在查看的页面,并且用户必须按两次后退按钮才能到达之前的页面,这并不理想。
有什么想法吗?
你应该在iframe中添加一些名称或ID
。javascript:(function(d){
var modal=document.createElement('iframe');
modal.setAttribute('src','http://myurl.com/page.html?url='+encodeURIComponent(window.location.href)+'&page_title='+document.title);
modal.setAttribute('scrolling','no');
modal.setAttribute('name', 'my_modal_window');
modal.className='modal';
document.body.appendChild(modal);
var c=document.createElement('link');
c.type='text/css';
c.rel='stylesheet';
c.href='//myurl.com/css/wl_iframe.css';
document.body.appendChild(c);
}(document));
然后
<a href="#" onclick="var modals = document.getElementsByName('my_modal_window'), i = modals.length; while(i--){ modals[i].parentNode.removeChild(modals[i])}">X close window</a>
编辑 工作解决方案,刚刚在Chrome JS控制台内的堆栈溢出上进行了测试:
(function(d){
var modal=document.createElement('iframe');
modal.setAttribute('src','http://myurl.com/page.html?url='+encodeURIComponent(window.location.href)+'&page_title='+document.title);
modal.setAttribute('scrolling','no');
modal.setAttribute('name', 'my_modal_window');
modal.className='modal';
document.body.appendChild(modal);
var c=document.createElement('link');
c.type='text/css';
c.rel='stylesheet';
c.href='/css/wl_iframe.css';
document.body.appendChild(c);
var a = document.createElement('a');
a.onclick= function(){
var modals = document.getElementsByName('my_modal_window'),i = modals.length;
while (i--) {
modals[i].parentNode.removeChild(modals[i]);
}
};
a.innerHTML = 'Close Iframes';
document.body.appendChild(a);
}(document))
相关文章:
- 将IE模拟模式从iframe覆盖到IE8
- 有没有一种方法可以在设计模式下将ng模型或工厂绑定到iframe
- 使用按钮关闭 iframe 模式
- Twitter引导模式-从iframe中获取信息并填充在主页上
- 关闭iframe中的模式弹出窗口
- 如果在iframe中,引导模式弹出将忽略滚动位置
- IFRAME和谷歌应用程序脚本中的NATIVE模式
- 传递数据 id 以引导模式并使用它 iframe url
- 火狐浏览器 iframe 设计模式不起作用
- 从 iframe 内部关闭引导模式,然后转到父页面的特定部分
- 如何在模式弹出窗口关闭时停止 iframe 播放器(并停止播放)
- 如何在IE8模式下模拟Iframe
- 如何使用 iframe 在模式窗口中显示内容
- 当 boostrap 模式在 jQuery 中可见时添加 iFrame
- 某些 YouTube iframe 嵌入在 HTML5 模式下不起作用
- 打开 jquery 模式对话框后,Iframe 内容会丢失
- Iframe 进入全屏模式
- 如何在 iframe 中使用全屏模式
- extjs“iframe架构”的缺点(我应该重构为MVC模式吗?
- apprequest 的 FB.ui 对话框在 iframe 模式下永久挂起