17

In my MVC application being developed for sales, I have a button which opens a web page which doesn't allow iframe to open in a new tab. So, when the sales agent use this button, they often don't close the tabs opened by the application and in the end of the day, there is 20-30 of open tabs. So, I was wondering if there is a script which I can add to a new button which could close:

  1. Either the complete browser with all tabs in it so they can start fresh or
  2. Close all other tabs without affecting the current tab.

In the view, I have

HTML

<input type="submit" onclick="return OpenInNewTab('http://test.com');" name="command" value="nonIframe" background-image:url(../images/URL/Test.png);" class="submit" />

Javascript

//Function OpenInNewTab
function OpenInNewTab(url) {
    var win = window.open(url, '_blank');
    win.focus();
    return false;
}

I was playing with this script, but it only closes the current tab. I want the current tab to be open and close all other tabs or close the entire browser itself.

Javascript

<script language="JavaScript">
    function closeIt() {
        close();
    }
</script>

HTML

<center>
    <form>
        <input type=button value="Close Window" onClick="closeIt()">
    </form>
</center>

Any suggestions would be really appreciated. Thank You

Community
  • 1
  • 1
user2908229
  • 265
  • 1
  • 2
  • 11
  • 1
    Source for your `OpenInNewTab()` function? You can keep track of windows (tabs) you opened by saving the return value of `window.open()` – Stephen P Mar 23 '15 at 21:30
  • @StephenP, Thanks for pointing that out. I have updated it. – user2908229 Mar 23 '15 at 21:36
  • 1
    Another thing to consider is to use a window name instead of `_blank`, e.g. `var win = window.open(url, 'workTab');` — that way it keeps re-using the same tab instead of opening a new one every time. This may not be acceptable if the sales-droids actually need more than one tab open at once. One last tip — learn how to attach event handlers from a separate `.js` file instead of using inline `onclick=...` handlers. – Stephen P Mar 23 '15 at 23:08
  • it depends, where is the opening button located? in every page? or just the root page? – Ayyash Jan 11 '17 at 10:22

4 Answers4

24

You can only close windows if you have their handle. That means your page needs to have been the one that opened them (or you somehow passed the handle around).

Example:

var winGoogle = window.open('http://google.com', '_blank');
var winBing = window.open('http://bing.com', '_blank');
var winYahoo = window.open('http://yahoo.com', '_blank');

//close the windows
winGoogle.close();
winBing.close();
winYahoo.close();

You could store these new windows in an array, and iterate over the handles when it is time to close them.

var windows = [];
//each time you open a new window, simply add it like this:
windows.push(window.open('http://google.com', '_blank'));

//then you can iterate over them and close them all like this:
for(var i = 0; i < windows.length; i++){
    windows[i].close()
}
Gray
  • 7,050
  • 2
  • 29
  • 52
  • 3
    Yep. push() and iterate is exactly what I was thinking when I commented. `+1` – Stephen P Mar 23 '15 at 23:09
  • Still, it's going through the function but not closing anything. Let me try again. In the meantime, anyone knows if we can replicate Ctrl+F4 combination to a button so it can close? Not sure, if someone has tried already? I was thinking to try something like this. if ( evt.altKey && evt.keyCode==115) then condition – user2908229 Mar 25 '15 at 16:06
  • @user2908229 not sure why it wouldn't work for you. Can you not just tell your users that they can right click on a tab and say "close other tabs" or "close tabs to the right"? Can you do like Stephen P suggested and overwrite the same tab each time? – Gray Mar 25 '15 at 17:15
  • 1
    I would make a slight adjustment to this to keep track of all windows open, by pushing to the most parent windows collection... instead of windows.push, you try and find window.top.windows, and keep looping until the there are no top windows, then add it to collection. Now the close button should also try to find the most parent windows collection, the trick is, exlcuding the window the fired the event... – Ayyash Jan 11 '17 at 10:24
3

HTML:

<a href="javascript: window.open('', '_self', '').close();">Close Tab</a>

javascript:

window.open('', '_self', '').close();

IT will close the current tab without prompting a permission.

0

Building on Mohamed Musthaque's excellent answer ... I wanted to open a new tab and close the current one. This does it perfectly in Chrome

<a href='https:...'
  onclick='window.open(this.href); window.open("", "_self", "").close(); return false;'> 
  Open new tab, close this one
</a>
George Fisher
  • 3,046
  • 2
  • 16
  • 15
0

working prototype based on @Gray's answer:

    <html lang="en">
    <head>
        <title>Sample-close specific tabs</title>
    </head>
    <body style="text-align: center;">
            <a href="#" onClick="openGoogle();">Google</a> | 
            <a href="#" onClick="openBing();">Bing</a> | 
            <a href="#" onClick="openYahoo();">Yahoo</a><br />
            <a href="#" onClick="closeAll()">closeAll</a><br />
    </body>
        <script>

            var winGoogle;
            var winBing;
            var winYahoo;

            var windows = [];

            function openGoogle(){
                winGoogle = window.open('https://google.com', '_blank');
                windows.push(winGoogle);
            }

            function openBing(){
                winBing = window.open('https://bing.com', '_blank');
                windows.push(winBing);
            }

            function openYahoo(){
                winYahoo = window.open('https://yahoo.com', '_blank');
                windows.push(winYahoo);
            }

            function closeAll(){
                console.log("length: " + windows.length);

                for(var i = 0; i < windows.length; i++){
                    windows[i].close()
                    console.log(windows[0]);
                }
            }
        </script>
    </html>
BustedSanta
  • 1,368
  • 7
  • 28
  • 55