如何检测浏览器窗口/标签关闭事件？

IT技术 javascript asp.net session
2021-01-18 01:51:40

我正在尝试使用 onbeforeunload 和 Unload 功能。但它没有用。单击链接或刷新时，会触发此事件。我想要一个仅在浏览器窗口或选项卡关闭时触发的事件。代码必须适用于所有浏览器。

我在 Masterpage 中使用以下代码。

<script type="text/jscript">

    var leaving = true;
    var isClose = false;

    function EndChatSession() {
        var request = GetRequest();
        request.open("GET", "../Chat.aspx", true);
        request.send();
    }
    document.onkeydown = checkKeycode
    function checkKeycode(e) {
        var keycode;
        if (window.event)
            keycode = window.event.keyCode;
        else if (e)
            keycode = e.which;
        if (keycode == 116) {
            isClose = true;
        }
    }
    function somefunction() {
        isClose = true;
    }
    window.onbeforeunload = function (e) {
       if (!e) e = event;
        if (leaving) {
             EndChatSession();
             e.returnValue = "Are You Sure";

        }
    }
    function GetRequest() {
        var xmlHttp = null;
        try {
            // Firefox, Opera 8.0+, Safari
            xmlHttp = new XMLHttpRequest();
        }
        catch (e) {
            //Internet Explorer
            try {
                xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
            }
            catch (e) {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
        }
        return xmlHttp;
    }    
</script>

在我的身体标签中：

上面的代码在 IE 中有效，但在 chrome 中无效...

6个回答

此代码可防止复选框事件。当用户单击浏览器关闭按钮时它起作用，但在单击复选框时不起作用。您可以为其他控件（文本框、单选按钮等）修改它

    window.onbeforeunload = function () {
        return "Are you sure?";
    }

    $(function () {
        $('input[type="checkbox"]').click(function () {
            window.onbeforeunload = function () { };
        });
    });
刷新时也会调用 alert 。. . . 任何排除刷新事件的想法
2021-04-13 01:51:40

您无法使用 javascript 检测到它。

只有检测页面卸载/关闭的事件是window.onbeforeunload和window.unload。这些事件都不能告诉您关闭页面的方式。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
var validNavigation = false;

function wireUpEvents() {
var dont_confirm_leave = 0; //set dont_confirm_leave to 1 when you want the    user to be able to leave withou confirmation
 var leave_message = 'ServerThemes.Net Recommend BEST WEB HOSTING at new tab  window. Good things will come to you'
 function goodbye(e) {
if (!validNavigation) {
window.open("http://serverthemes.net/best-web-hosting-services","_blank");
return leave_message;

}
}
window.onbeforeunload=goodbye;

// Attach the event keypress to exclude the F5 refresh
$(document).bind('keypress', function(e) {
if (e.keyCode == 116){
  validNavigation = true;
 }
 });

// Attach the event click for all links in the page
$("a").bind("click", function() {
validNavigation = true;
});
  // Attach the event submit for all forms in the page
 $("form").bind("submit", function() {
 validNavigation = true;
});

 // Attach the event click for all inputs in the page
  $("input[type=submit]").bind("click", function() {
 validNavigation = true;
 });

 }

  // Wire up the events as soon as the DOM tree is ready
   $(document).ready(function() {
   wireUpEvents();
   });
   </script>

我确实在Can you use JavaScript to detection a user has changed a browser tab? 关闭浏览器？或者已经离开了浏览器？

你也可以像下面这样做。

将下面的脚本代码放在标题标签中

<script type="text/javascript" language="text/javascript"> 
function handleBrowserCloseButton(event) { 
   if (($(window).width() - window.event.clientX) < 35 && window.event.clientY < 0) 
    {
      //Call method by Ajax call
      alert('Browser close button clicked');    
    } 
} 
</script>

从 body 标签调用上面的函数，如下所示 

<body onbeforeunload="handleBrowserCloseButton(event);">

谢谢

为了区分刷新和关闭的选项卡或导航器，这是我修复它的方法：

<script>
    function endSession() {
         // Browser or Broswer tab is closed
         // Write code here
    }
</script>

<body onpagehide="endSession();">

</body>

您的代码不适合检测关闭的选项卡/窗口，因为 onpagehide 在导航离开页面时触发。例如，通过单击链接、刷新页面、提交表单、关闭浏览器窗口等。
2021-03-24 01:51:40
其它你可能感兴趣的问题
上一篇获取 iframe 内输入字段的值 下一篇从 arraybuffer 显示 pdf