Close current web page onclick button using javascript? - javascript

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.

Related

window.close fails when clicking links within opened window

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.

Detect if window.close() will work before using it (JavaScript)

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.

How to create a pop up browser window that contains a GUI and controls a parent browser window

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.

Close Browser window while unloading

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.

window.open() still returns null

I am using IE8 on Windows 7. Referred to several threads and understand that in IE8 when I am using window.open to popup a new window, the JavaScript window.open is returning null value.
If I run IE as administrator or disable the protected mode, I see the window.open returns the expected object.
I am looking out for a solution apart from the options mentioned above. For such a small feature (opening a popup) I cannot ask customer to run IE as administrator or disable the protected mode.
If there is any work around, please let me know. It will be a great help.
Primarily, I want to make sure that only one window is opened when user clicks multiple times on the link and give the focus to the window which is already open. To achieve this I need to get the object from window.open so that I can check if the window is already open and give the focus to the already opened window. Otherwise open a new window.
For IE10, window.open returns a NULL reference object if Enable Protected Mode is checked under Internet Options->Security->Security Level for this zone and the ZONE is different i.e. in my case local file opening a popup from Intranet.
window.open returns a reference object even if Enable Protected Mode is checked when yoursite.com opens someothersite.com in popup window i.e. Internet->Internet
You can use window.showModalDialog as a alternative or replacement for window.open method.
It is more secure then window.open. It will not allow user clicking the Parent page.
Example Usage:
var myFeatures = "dialogWidth:1060px;dialogHeight:550px;resizable:yes";
window.showModalDialog(url,window,myFeatures);
//Here window is an object, no need to assign or declare.
If you want more detail explanation see Here.
//Fifth Question.

Categories