blocks|key|1635364|text|“关闭”当前的iFrame是不可能的，但您可以告诉父dom操作dom并使其不可见。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1635365|在IFrame中：|1635366|parent.closeIFrame();|code-block|syntax|javascript|1635367|在parent中：|1635368|function+closeIFrame(){
+++++$('#youriframeid').remove();
}|1635369|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

"Closing" the current iFrame is not possible but you can tell the parent to manipulate the dom and make it invisible.

In IFrame:

<pre><code>parent.closeIFrame();
</code></pre>

In parent:

<pre><code>function closeIFrame(){
 $('#youriframeid').remove();
}
</code></pre>

blocks|key|3250745|text|function+closeWin()+++//+Tested+Code
{
var+someIframe+=+window.parent.document.getElementById('iframe_callback');
someIframe.parentNode.removeChild(someIframe));
}


<input+class="question"+name="Close"+type="button"+value="Close"+onClick="closeWin()"+tabindex="10"+/>+|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|3250746|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>function closeWin() // Tested Code
{
var someIframe = window.parent.document.getElementById('iframe_callback');
someIframe.parentNode.removeChild(someIframe));
}


&lt;input class=&quot;question&quot; name=&quot;Close&quot; type=&quot;button&quot; value=&quot;Close&quot; onClick=&quot;closeWin()&quot; tabindex=&quot;10&quot; /&gt; 
</code></pre>

blocks|key|50127|text|使用此选项可从iframe本身的父级中删除iframe|type|unstyled|depth|inlineStyleRanges|entityRanges|data|50128|frameElement.parentNode.removeChild(frameElement)|code-block|syntax|javascript|50129|仅适用于同一来源(不允许跨来源)|50130|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Use this to remove iframe from parent within iframe itself

<pre><code>frameElement.parentNode.removeChild(frameElement)
</code></pre>

It works with same origin only(not allowed with cross origin)

blocks|key|50141|text|这有点老生常谈，但它工作得很好|type|unstyled|depth|inlineStyleRanges|entityRanges|data|50142|+function+close_frame(){
++++if(!window.should_close){
++++++++window.should_close=1;
++++}else+if(window.should_close==1){
++++++++location.reload();
++++++++//or+iframe+hide+or+whatever
++++}
+}

+<iframe+src="iframe_index.php"+onload="close_frame()"></iframe>|code-block|syntax|javascript|50143|然后在框架内|50144|$('#close_modal_main').click(function(){
++++++++window.location+=+'iframe_index.php?close=1';
});|50145|如果你想通过一个|50146|if(isset($_GET['close'])){
++die;
}|50147|在框架页面的顶部，使重新加载变得不可察觉|50148|因此，基本上在第一次加载框架时，它不会隐藏自己，但在下一次加载时，它将调用onload函数，父窗口将具有一个窗口变量，从而导致框架关闭|50149|entityMap^0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|W|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|Y|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|Z|8|@]|9|@]|A|$E|F]]|$1|O|3|P|5|6|7|10|8|@]|9|@]|A|$]]|$1|Q|3|R|5|6|7|11|8|@]|9|@]|A|$]]|$1|S|3|-4|5|6|7|12|8|@]|9|@]|A|$]]]|T|$]]

its kind of hacky but it works well-ish

<pre><code> function close_frame(){
 if(!window.should_close){
 window.should_close=1;
 }else if(window.should_close==1){
 location.reload();
 //or iframe hide or whatever
 }
 }

 &lt;iframe src="iframe_index.php" onload="close_frame()"&gt;&lt;/iframe&gt;
</code></pre>

then inside the frame

<pre><code>$('#close_modal_main').click(function(){
 window.location = 'iframe_index.php?close=1';
});
</code></pre>

and if you want to get fancy through a

<pre><code>if(isset($_GET['close'])){
 die;
}
</code></pre>

at the top of your frame page to make that reload unnoticeable

so basically the first time the frame loads it doesnt hide itself but the next time it loads itll call the onload function and the parent will have a the window var causing the frame to close

blocks|key|3250848|text|这些解决方案对我都不起作用，因为我是在一个跨域的场景中创建一个像Pinterest的Pin+It这样的书签小程序。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3250849|我在GitHub+https://gist.github.com/kn0ll/1020251上找到了一个bookmarklet模板，它解决了关闭Iframe并从其中发送命令的问题。|offset|length|3250850|因为我不能访问IFrame中父窗口中的任何元素，所以只能使用window.postMessage在两个窗口之间发布事件来进行这种通信|3250851|所有这些步骤都在GitHub链接上：|3250852|1-您必须在父页面上注入一个JS文件。|3250853|2-在这个注入到父级上的文件中，添加一个窗口事件侦听器|3250854|++++window.addEventListener('message',+function(e)+{
+++++++var+someIframe+=+window.parent.document.getElementById('iframeid');
+++++++someIframe.parentNode.removeChild(window.parent.document.getElementById('iframeid'));
++++});|code-block|syntax|javascript|3250855|此监听器将处理close和您希望的任何其他事件|3250856|3-在Iframe页面中，通过postMessage发送close命令：|3250857|+++$(this).trigger('post-message',+[{
++++++++++++++++++++event:+'unload-bookmarklet'
++++++++++++++++}]);|3250858|遵循https://gist.github.com/kn0ll/1020251上的模板，你就会很好！|3250859|希望能有所帮助，|3250860|entityMap|0|LINK|mutability|MUTABLE|url|https://gist.github.com/kn0ll/1020251|1^0|0|9|11|0|0|0|0|0|0|0|0|0|0|2|11|1|0|0^^$0|@$1|2|3|4|5|6|7|1B|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|1C|8|@]|9|@$D|1D|E|1E|1|1F]]|A|$]]|$1|F|3|G|5|6|7|1G|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|1H|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|1I|8|@]|9|@]|A|$]]|$1|L|3|M|5|6|7|1J|8|@]|9|@]|A|$]]|$1|N|3|O|5|P|7|1K|8|@]|9|@]|A|$Q|R]]|$1|S|3|T|5|6|7|1L|8|@]|9|@]|A|$]]|$1|U|3|V|5|6|7|1M|8|@]|9|@]|A|$]]|$1|W|3|X|5|P|7|1N|8|@]|9|@]|A|$Q|R]]|$1|Y|3|Z|5|6|7|1O|8|@]|9|@$D|1P|E|1Q|1|1R]]|A|$]]|$1|10|3|11|5|6|7|1S|8|@]|9|@]|A|$]]|$1|12|3|-4|5|6|7|1T|8|@]|9|@]|A|$]]]|13|$14|$5|15|16|17|A|$18|19]]|1A|$5|15|16|17|A|$18|19]]]]

None of this solution worked for me since I'm in a cross-domain scenario creating a bookmarklet like Pinterest's Pin It.

I've found a bookmarklet template on GitHub <a href="https://gist.github.com/kn0ll/1020251" rel="noreferrer">https://gist.github.com/kn0ll/1020251</a> that solved the problem of closing the Iframe sending the command from within it.

Since I can't access any element from parent window within the IFrame, this communication can only be made posting events between the two windows using window.postMessage

All these steps are on the GitHub link:

1- You have to inject a JS file on the parent page.

2- In this file injected on the parent, add a window event listner 

<pre><code> window.addEventListener('message', function(e) {
 var someIframe = window.parent.document.getElementById('iframeid');
 someIframe.parentNode.removeChild(window.parent.document.getElementById('iframeid'));
 });
</code></pre>

This listener will handle the close and any other event you wish

3- Inside the Iframe page you send the close command via postMessage:

<pre><code> $(this).trigger('post-message', [{
 event: 'unload-bookmarklet'
 }]);
</code></pre>

Follow the template on <a href="https://gist.github.com/kn0ll/1020251" rel="noreferrer">https://gist.github.com/kn0ll/1020251</a> and you'll be fine!

Hope it helps,

How do I use javascript or jQuery to close an iframe within iframe itself? I've tried <code>&lt;a href="javascript:self.close()"&gt;</code> but it didn't work.

How to close an iframe within iframe itself

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

如何使用javascript或jQuery在iframe中关闭iframe？我尝试过<a href="javascript:self.close()">，但它不起作用。

问如何在iframe本身中关闭iframe
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在iframe本身中关闭iframeEN