JS Collection of Listening Methods for Browser Window Close Events

  • 2021-06-29 10:19:37
  • OfStack

This article provides an example of how JS listens for browser window closure events.Share it for your reference, as follows:

Mode 1: (For IE browser, refresh is not prompted, only when browser close button is clicked)


<script type="text/javascript">
window.onbeforeunload=onclose;
function onclose()
{
if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey)
{
return " Are you leaving? ";
}
}
</script>

Mode 2: For IE and FF, do not distinguish between refresh and shutdown


<script type="text/javascript">
  window.onbeforeunload = onbeforeunload_handler;
  window.onunload = onunload_handler;
  function onbeforeunload_handler(){
    var warning=" Confirm Exit ?";
    return warning;
  }
  function onunload_handler(){
    var warning=" Thank you for your coming ";
    alert(warning);
  }
</script>

Mode 3: For IE and FF, no distinction between refresh and shutdown, the simplest


<script type="text/javascript">
window.onbeforeunload=onclose;
function onclose()
{
return " Are you sure you want to quit? ";
}
</script>

Mode 4: For IE and FF, no distinction between refresh and shutdown, slightly more complex


<script language="javascript">
var MSG_UNLOAD=" If you leave the file system at this time, all the information you have done will be lost. Do you want to leave? ?";
var UnloadConfirm = {};
// Enable methods to monitor browser refresh and shutdown 
UnloadConfirm.set = function(confirm_msg){
  window.onbeforeunload = function(event){
    event = event || window.event;
    event.returnValue = confirm_msg;
  }
}
// Turn off methods to monitor browser refresh and shutdown 
UnloadConfirm.clear = function(){
  window.onbeforeunload = function(){};
}
UnloadConfirm.set(MSG_UNLOAD);
</script>

Mode 5: Only for close buttons and shortcuts under IE6, refresh without prompting


<script type="text/javascript">
window.onbeforeunload=onclose;
function onclose()
{
var warnning = '<fmt:message key="systemMessage.exitWarning" />';
var beforeExit='<fmt:message key="systemMessage.beforeExitWarning" />';
 if(event.clientY<0 && event.clientX>document.body.clientWidth-20 || event.clientY<0 && event.clientX<20 ||
event.altKey || event.ctrlKey || event.clientY>document.body.clientHeight){
alert(beforeExit);
return warnning;
}
}
</script>

JS to determine browser type


<script type="text/javascript">
    var Sys = {};
    var ua = navigator.userAgent.toLowerCase();
    if (window.ActiveXObject)
      Sys.ie = ua.match(/msie ([\d.]+)/)[1]
    else if (document.getBoxObjectFor)
      Sys.firefox = ua.match(/firefox\/([\d.]+)/)[1]
    else if (window.MessageEvent && !document.getBoxObjectFor)
      Sys.chrome = ua.match(/chrome\/([\d.]+)/)[1]
    else if (window.opera)
      Sys.opera = ua.match(/opera.([\d.]+)/)[1]
    else if (window.openDatabase)
      Sys.safari = ua.match(/version\/([\d.]+)/)[1];
    // The following tests are performed 
    if(Sys.ie) document.write('IE: '+Sys.ie);
    if(Sys.firefox) document.write('Firefox: '+Sys.firefox);
    if(Sys.chrome) document.write('Chrome: '+Sys.chrome);
    if(Sys.opera) document.write('Opera: '+Sys.opera);
    if(Sys.safari) document.write('Safari: '+Sys.safari);
</script>

Distinguish browsers, IE and FF handle them separately (oddly, IE sometimes fails)


<script type="text/javascript">
window.onbeforeunload=onclose;
function onclose()
{
var Sys = {};
var warnning = '<fmt:message key="systemMessage.exitWarning" />';
var ua = navigator.userAgent.toLowerCase();
if (window.ActiveXObject)
  Sys.ie = ua.match(/msie ([\d.]+)/)[1]
else if (document.getBoxObjectFor)
  Sys.firefox = ua.match(/firefox\/([\d.]+)/)[1]
if(Sys.ie) {//for IE
if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey)
{
window.event.returnValue = warnning ;
}
}
if(Sys.firefox) //for FF
return warnning;
}
</script>

The easiest way to determine the browser type


<script type="text/javascript">
if(-[1,]){
   alert(" This is not IE Browser! ");
}else{
   alert(" This is IE Browser! ");
}
</script>

[1,] returns the string "1" in standard browsers, which is equivalent to calling [1,]. toString,
IE returns "1,".However, both the IE and the standard pass detection, so negative signs are used to force conversion to numbers.

Standard can be successfully converted to 1, 1 will be automatically converted to true in if, IE to NaN, and then to false!

More readers interested in JavaScript-related content can view this site's topics: json Operation Skills Summary in JavaScript, JavaScript Switching Special Effects and Skills Summary, JavaScript Find Algorithmic Skills Summary, JavaScript Animation Special Effects and Skills Summary, JavaScript Errors and Debugging Skills Summary, JavaScript Data Structure and Algorithmic Skills Summary,Summary of JavaScript Traversal Algorithms and Techniques and Summary of JavaScript Mathematical Usage

I hope that the description in this paper will be helpful to everyone's JavaScript program design.


Related articles: