通過iFrame中的按鈕關閉一個（對話框）iFrame
[英]Close a (dialog box) iFrame from a button within the iFrame
問題描述
我有兩個文件，分別名為main_page.html和dialog_box.html （請參見下面的代碼）。 我希望我的handleCloseDialogButton() “關閉對話框”，換句話說，重新加載main_page.html ，而theFrame.style.display重置為“ none”。 我怎樣才能做到這一點 ？ 我應該使用window.open("main_page.html")還是window.location.href="main_page.html"或其他方式？ 注意：我不想使用Javascript的alert()函數，因為它的功能不足以滿足我的需要。
main_page.html的內容：
<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<head>
<script>
function handleDialogButton()
{
var theFrame=document.getElementById("myDialogBox");
theFrame.style.display="block";
theFrame;
}
</script>
</head>
<body>
<div id="myDiv"> <h2> Hello world. This is the main page.</h2></div>
<iframe id="myDialogBox" src="./dialog_box.html" style="display:none"> </iframe>
<input type="button" id="dbbutton" name="dbbutton" value="Open Dialog Box"
onClick="javascript:handleDialogButton();" />
</body>
</html>
dialog_box.html的內容：
<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<head>
<script>
function handleCloseDialogButton()
{
}
</script>
</head>
<body>
<div id="myDiv"> <h2> Hello world. I am the dialog box.</h2></div>
<input type="button" id="cbbutton" name="cbbutton" value="Close Dialog Box"
onClick="javascript:handleCloseDialogButton();" />
</body>
</html>
1 個解決方案
解決方案1
1 已采納 2015-01-15 08:20:59
您可以使用window.parent從iframe訪問父元素。 有關詳細信息，請參見window.parent 。
使用window.parent，您可以調用父js函數，也可以訪問父元素。 在您的情況下，訪問父元素應該類似於：window.parent.document.getElementById（'myDialogBox'）;
在handleCloseDialogButton函數中使用此函數，並將其顯示設置為none：
function handleCloseDialogButton()
{
window.parent.document.getElementById('myDialogBox').style.display="none";
}
注意：這在Chrome的文件模式下不起作用。 您必須將頁面放在Web服務器上，然后它也可以在Chrome瀏覽器中使用。
jQuery如何在對話框中關閉iframe對話框？
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.