I have code which returns some other page (Google) in a popup (child) window. I cannot write any code in child window and so I have to do everything from the parent. I am trying to bind the onblur event from parent to the child window so that the child window should be closed once it lost the focus. However, the child window splash for a micro second and closes automatically.
I can't use jQuery in the environment I am working.
Here is my sample code:
<html>
<head>
</head>
<body>
<input type="button" value="Open Google" onclick="OpenWindow()" />
<script type="text/javascript">
function OpenWindow()
{
var url="";
var newWin=window.open(url, 'Popup','height=500,width=600,left=100,top=100,resizable=yes,scrollbars=no,toolbar=no,status=no');
newWin.focus();
newWin.onblur = newWin.close();
}
</script>
</body>
</html>
I have code which returns some other page (Google) in a popup (child) window. I cannot write any code in child window and so I have to do everything from the parent. I am trying to bind the onblur event from parent to the child window so that the child window should be closed once it lost the focus. However, the child window splash for a micro second and closes automatically.
I can't use jQuery in the environment I am working.
Here is my sample code:
<html>
<head>
</head>
<body>
<input type="button" value="Open Google" onclick="OpenWindow()" />
<script type="text/javascript">
function OpenWindow()
{
var url="http://www.google.";
var newWin=window.open(url, 'Popup','height=500,width=600,left=100,top=100,resizable=yes,scrollbars=no,toolbar=no,status=no');
newWin.focus();
newWin.onblur = newWin.close();
}
</script>
</body>
</html>
4 Answers
Reset to default 6Just skip the parenthesis behind .close()
newWin.onblur = newWin.close;
You want to pass a function reference, you don't want to assign the value which gets returned by executing .close().
Another answer can be as follows:
function open_popup() {
var my_window = window.open("", 'targetWindow', 'toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no,width=750px,height=500px');
var html = '';
html = "Muhammad Shoaib Qureshi's New Window Text";
my_window.document.write(html);
my_window.focus();
my_window.onblur = function() {
my_window.close();
};
}
No solution was working for me other than this above one.
Regards, Shoaib.
I got solution.
Use "window.top.close();"
The above solution(s) will no longer work on cross-origin domains and might throw this error
Blocked a frame with origin "https://example." from accessing a cross-origin frame.
To work around this we can add an event listener to the parent window and listen for the focus event, this should be fired after the user clicks back to the main window from the spawned child window, we can then close the frame.
let url = "https://example.";
let frame = window.open(url, "Popup", "height=500,width=600,left=100,top=100,resizable=yes,scrollbars=no,toolbar=no,status=no");
window.addEventListener('focus', (e) => {
if (!frame.closed) frame.close()
})