CODEWITHSUNDEEP
javascripttabs
Eswar
Eswar

Reputation: 293

How to detect the window(new tab) close event?

I have one parent page and child page. the child page opened in new tab

I want to show one alert message (The child page is closing), when i close the child tab.
How to show the closing messgae, when close the tab? (Not refreshing time)

I used onunload, and onbeforeunload.
Two methods are also called, when the page refresh and tab closing. 

window.onunload = function doUnload(e)
{
  alert('Child window is closing...'); 
}

and 

window.onbeforeunload = function doUnload(e)
{
  alert('Child window is closing...'); 
}

I must show the alert message, only close the tab in browser.

Help me. Thanks in advance.

Update

I use the following script. Its worked In IE. But not worked in FireFox

  <script language="javascript" type="text/javascript">          

  window.onbeforeunload = function()
  {   
      if ((window.event.clientX < 0) || (window.event.clientY < 0) || (window.event.clientX < -80)) 
     {            
          alert("Child window is closing...");  
     }   
 };   

</script>

How to acheive this in FireFox and other Browser.

Upvotes: 2

Views: 24632

Answers (4)

Gary
Gary

Reputation: 2339

You might not be able to do that other than some cookie based methods which is development work arounds like non persistent cookies. Second identifying a page refresh, form based redirect, or back redirect or browser close unload event identification is not direct and is tedious. Recommend not to depend on it.

you can do some small things before the customer closes the tab. javascript detect browser close tab/close browser but if your list of actions are big and the tab closes before it is finished you are helpless. You can try it but with my experience donot depend on it. Yes, you cannot at this time differentiate back and refresh and close. So no foolproof way of saying whether the child has definitely closed.

window.addEventListener("beforeunload", function (e) {
  var confirmationMessage = "\o/";
  /* Do you small action code here */
  (e || window.event).returnValue = confirmationMessage; //Gecko + IE
  return confirmationMessage;                            //Webkit, Safari, Chrome
});

https://developer.mozilla.org/en-US/docs/Web/Reference/Events/beforeunload?redirectlocale=en-US&redirectslug=DOM/Mozilla_event_reference/beforeunload

Upvotes: 0

Alex
Alex

Reputation: 5724

Does the script from http://chrismckee.co.uk/good-sir-before-you-unload-crossbrowser-javascript-headaches/ work?

Assuming your just trying to fire beforeunload event crossbrowser, this pretty much does it ( excluding opera )

try{
    // http://www.opera.com/support/kb/view/827/
    opera.setOverrideHistoryNavigationMode('compatible');
    history.navigationMode = 'compatible';
}catch(e){}

//Our Where The F' Are You Going Message
function ReturnMessage()
{
    return "WTF!!!";
}

//UnBind Function
function UnBindWindow()
{
    window.onbeforeunload = null;
    return true;
}

//Bind Links we dont want to affect
document.getElementById('homebtn').onclick = UnBindWindow;
document.getElementById('googlebtn').onclick = UnBindWindow;

//Bind Exit Message Dialogue
window.onbeforeunload = ReturnMessage;

Upvotes: 1

mplungjan
mplungjan

Reputation: 178411

There is afaik never been a cross browser script for this. The solution is to NOT rely on undocumented and changeable features of a specific browser to detect something that is important.

Since you have a CHILD page, you can set up a test in the parent (opener) that at intervals test the childWindowHandle.closed property and acts on that.

Upvotes: 1

GustyWind
GustyWind

Reputation: 3036

There is an example in Mozilla Devloper site which basically says check for browser type and use the below check accordingly.Hope this helps.

Upvotes: 0

Related Questions