I am opening a new window with window.open(). If I do NOTHING else on this page, and click the "close window" link, the window closes. This works perfectly; however, if I navigate between pages(all under the same domain) window.close() no longer works.
Is there a way to fix this?
Here is how I am opening pages in this example...
<a href="###" target="_blank">
Here is my close link:
close
I use 2 methods of changing pages within the opened windows.
<select onchange="if (this.value) window.location.href=this.value"> AND STANDARD <a href="####"> tag
Do I need to navigate links within this window a certain way to still maintain my window.close() ability?
You should favour using window.open() to open a new window if you want to close it using window.close(). E.g.
<script>
function newWindow() {
window.open('foo.html', 'myWindow');
return false;
}
</script>
link
From MDN:
The Window.close() method closes the current window, or the window on which it was called. This method can only be called on windows that were opened by a script using the Window.open() method. If the window was not opened by a script, an error similar to this one appears in the console: Scripts may not close windows that were not opened by script.
I understand the behaviour you're describing where you can close the window as long as you don't navigate. I can replicate this in Google Chrome.
I believe this is because (from the spec):
A browsing context is script-closable if it is an auxiliary browsing context that was created by a script (as opposed to by an action of the user), or if it is a top-level browsing context whose session history contains only one Document.
Your new window is considered a "top-level browsing context", not an "auxilliary browsing context". Up until the point that you navigate, the history contains one document, so can be closed using window.close(). As soon as you navigate, the history has more than one document so it's not valid to close the window.
You should also have a read about window.opener and the security risks it poses.
window.opener provides a reference to the window object that opened the current window.
Recent advice is to use rel="noopener" on all links that open in new windows. Again, this is because setting window.opener without knowing what you're doing poses a security risk. Have a read about it here:
Links to cross-origin destinations are unsafe
Browsers are now starting to treat all target="_blank" links as if rel="noopener" had been set, even if you as a developer don't set it. You can see that this is now in most major browsers.
Therefore, you could use link (explicitly setting window.opener) and I think you'd get the behaviour you want. However, this might not be reliable across browsers, and also has security implications as described in the web.dev article.
Related
According to many rules and security features, window.close() will only work in specific cases:
From the latest working spec for window.close():
The close() method on Window objects should, if all the following conditions are met, close the browsing context A:
The corresponding browsing context A is script-closable.
The browsing context of the incumbent script is familiar with the browsing context A.
The browsing context of the incumbent script is allowed to navigate the browsing context A.
A browsing context is script-closable if it is an auxiliary browsing context that was created by a script (as opposed to by an action of the user), or if it is a browsing context whose session history contains only one Document.
I have a web application that allows users to close new windows and it works fine, except when the rules above are not respected.
What I am looking for is to detect when the close() function will work and only show the close button in such case.
I found information talking about window.opener that returns a reference from the window that opened it. But it doesn't work.
if(window.opener != null){
//show button
}
Maybe this is because the new window was opened using "right click -> open in new tab" and not a script. When tabs are opened in this fashion window.close() works, I just want to detect when window.close() will work.
Any ideas?
According to the docs, the window is script-closable also if session history of the given context is of length 1 (which is exactly what happens when you open a link in a new tab/window). You need to add that to your checker.
if(window.opener != null || window.history.length == 1){
//show button
}
As I understand it, there isn't a native way to do this. It is possible to check if window.close() has failed after the fact by checking if window.closed is false to detect an error. See here.
Your only option is to offer the functionality to close every window, or try to in all cases, and ask the user to close it manually if it fails - otherwise it cannot be closed by you, or any of your code, by definition. There isn't a way around that unfortunately. One option that might be worth trying would be to redirect them somewhere if the window cannot be closed programmatically, which you can verify easily after every attempt.
I have web page on which there is a button 'start'. Now I want that onclick of that 'start' button this page will be closed. can i do this using javascript?
<input type="button" value="Close" onclick="window.close()" />
<script>window.close();</script>
Going to another page will close the current page (stopping execution of any other scripts on it, etc).
location = "http://duckduckgo.com";
You will need Javascript to do this. Use window.close()
close();
Note: the current window is implied. This is equivalent:
window.close();
or you can specify a different window.
So:
function close_window() {
if (confirm("Close Window?")) {
close();
}
}
with HTML:
close
or:
close
You return false here to prevent the default behavior for the event. Otherwise the browser will attempt to go to that URL (which it obviously isn't).
Now the options on the window.confirm() dialog box will be OK and Cancel (not Yes and No). If you really want Yes and No you'll need to create some kind of modal Javascript dialog box.
Note: there is browser-specific differences with the above. If you opened the window with Javascript (via window.open()) then you are allowed to close the window with javascript. Firefox disallows you from closing other windows. I believe IE will ask the user for confirmation. Other browsers may vary.
You can only use Javascript to close a window that was created via javascript, this is a security feature. Therefore window.close(); is not going to work in most scenarios as some other users have pointed out.
What I'd do is open an new instance of the current window setting the target to _self and then closing this e.g:
window.open(window.location, '_self').close();
Or:
<script type="text/javascript">
function closeWindow(){
window.open(window.location, '_self').close();
}
</script>
<input type="button" id="btnClose" value="Close window" onclick="closeWindow();" />
See the w3.org docs on window.close(). Pay close attention to:
The close() method on Window objects should, if all the following conditions are met, close the browsing context A:
The corresponding browsing context A is script-closable.
The responsible browsing context specified by the incumbent settings
object is familiar with the browsing context A.
The responsible browsing context specified by the incumbent settings object is allowed
to navigate the browsing context A.
In particular:
The corresponding browsing context A is script-closable.
What is "script closable"?
A browsing context is script-closable if it is an auxiliary browsing context that was created by a script (as opposed to by an action of the user), or if it is a top-level browsing context whose session history contains only one Document.
The proposed solution is a bit of a hack though. If compatibility is an issue I would recommend doing whatever it is you're doing in this window inside a pop-up/'script closable' window so that you can guarantee support.
Is there a way in jquery and/or javascript to create a pop up window that can directly effect a parent window in a browser? In my case I want to set up a GUI in the pop up which can move objects in the parent window left/right/up/down. I also need this to work in a dual monitor setting. Any leads on how to do this would be great!
Functions in the child window can control the parent window by using parent. for example:
parent.alert("moo");
You can use window.opener to interact with the opening window, since it sounds like you want to open a new window. So if you have a javascript function declared in the opening window as
function test(){
alert("I'm the parent!");
}
you can call it from a popup window by calling
window.opener.test();
The requirement here is that both the opening window and the open window must be either in the same domain or at least subdomain. If it is the same subdomain, a little work is needed to allow the cross-domain access, which you can read more about here https://stackoverflow.com/a/3962489/1558122.
You would initially open the popup of course by calling window.open from the parent, and dual monitor should not affect the behavior here.
What you really want is probably a dialog, not a window. Windows are cumbersome and require all the HTML a document requires. You could try this jquery plugin: http://jqueryui.com/dialog/ . A dialog requires minimal HTML.
I confess I don't know about the dual-monitor thing.
I have a web application where page #1 opens a popup window using
window.open(myUrl, "fixedApplicationTargetId", "");
Then page #2 overwrites the same popup window with a call to window.open using the same target value
window.open(anotherUrl, "fixedApplicationTargetId", "");
At this point the content of the popup originally created by page #1 shows the new content created by page #2. So far so good with any browser.
Then the popup itself detects who last opened the popup and updated the content using window.opener. Prior to calling window.open both page #1 and page #2 create a global variable globalPageId and assign a unique number each. The popup checks the value of window.opener.globalPageId and detects which window last updated the popup content.
This is where things fall apart: the above works fine with chrome and firefox that update window.opener in the popup each time the content is updated with window.open. Instead, IE and opera always point the popup window.opener to the first window that used window.open.
Any suggestion, in a context where multiple pages call window.open on the same target, how to detect from the popup itself which window last opened the window?
window.opener is supposed to be read-write (except in Internet Explorer 3), so you could set it to the appropriate window yourself. Some browsers, however, restrict this operation and only allow setting opener to null to prevent security issues.
An alternate solution would be to use a custom property instead of opener. You could set it by hand:
window.open(myUrl, "fixedApplicationTargetId", "").realOpener = window;
Then use window.realOpener.globalPageId instead of window.opener.globalPageId in the rest of your code.
I have MyPage.aspx html page (generated using ASP.Net). When user tries to navigate away from this page, I need to close the window – user should not be able to go back or navigate to another page.
When I used window.close() inside window.onbeforeunload event, it asks for a confirmation to the user. “The webpage you are viewing is trying to close the window. Do you want to close the window?” On clicking “No” the user can escape the close attempt. Is there any way to forcefully close the window without giving an option to the user?
Reference:
How can I close a browser window without receiving the "Do you want to close this window" prompt?
Html javascript to open new window and close current window
"Unknown Exception" when cancelling page unload with "location.href"
Display confirmation popup with JavaScript upon clicking on a link
You can "trick" the browser like this:
window.onbeforeunload = function() {
window.open('', '_self', '');
window.close();
}
It seems to work in chrome/safari/ie/ff: http://jsbin.com/olijig/1
Firefox seems stubborn, but there might be another way to do the same in FF.
I should probably say that this technique is in no way standard and I don’t recommend it at all, and this code might break in many browsers besides firefox.
UPDATE
It actually works in Firefox too (latest version), but not older versions (I tried 3.6.1). You need to do some more testing to confirm the browser compatibility.
No, you can't. The user must be always capable of controlling whatever happens in his browser.
I'm not positive about this, but I believe if you have a window open another window, the parent window can close that child window. Would it be practical to have a landing page that opens your app in a separate window that could then close the window through javascript? Someone can probably elaborate more, as I haven't done this myself.