com*_*tta 272 javascript jquery
是否有任何跨浏览器的JavaScript/jQuery代码来检测浏览器或浏览器选项卡是否正在关闭,而不是由于链接被点击？
jAn*_*ndy 254
如果我找到你,你想知道什么时候选项卡/窗口有效关闭.好了,据我所知的唯一途径Javascript,以检测之类的东西都onunload与onbeforeunload事件.
不幸的是(或者幸运的是？),当您将网站留link在浏览器或浏览器后退按钮时,这些事件也会被触发.所以这是我能给出的最佳答案,我认为你不能close在Javascript 中原生地检测到纯粹的答案.如果我在这里错了,请纠正我.
moh*_*him 114
出于某些原因,基于Webkit的浏览器不遵循对话框的规范.一个几乎交叉的例子将接近下面的例子.
window.addEventListener("beforeunload", function (e) {
var confirmationMessage = "\o/";
(e || window.event).returnValue = confirmationMessage; //Gecko + IE
return confirmationMessage; //Webkit, Safari, Chrome
});
此示例用于处理所有浏览器.
小智 44
简单解决方案
window.onbeforeunload = function () {
return "Do you really want to close?";
};
小智 18
<body onbeforeunload="ConfirmClose()" onunload="HandleOnClose()">
var myclose = false;
function ConfirmClose()
{
if (event.clientY < 0)
{
event.returnValue = 'You have closed the browser. Do you want to logout from your application?';
setTimeout('myclose=false',10);
myclose=true;
}
}
function HandleOnClose()
{
if (myclose==true)
{
//the url of your logout page which invalidate session on logout
location.replace('/contextpath/j_spring_security_logout') ;
}
}
//如果您只使用一个选项卡关闭选项卡或浏览器,则此功能在IE7中有效
Syn*_*yno 10
我找到了一种适用于我所有浏览器的方法。
在以下版本上进行了测试：Firefox 57、Internet Explorer 11、Edge 41、最新的 Chrome 之一（它不会显示我的版本）
注意：如果您以任何可能的方式离开页面（刷新、关闭浏览器、重定向、链接、提交...），则 onbeforeunload 会触发。如果您只希望它在浏览器关闭时发生，只需绑定事件处理程序。
$(document).ready(function(){
var validNavigation = false;
// Attach the event keypress to exclude the F5 refresh (includes normal 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;
});
window.onbeforeunload = function() {
if (!validNavigation) {
// -------> code comes here
}
};
});
没有事件，但在window.closed撰写本文时，所有主要浏览器都支持一个属性。因此，如果您真的需要知道您可以轮询窗口以检查该属性。
if(myWindow.closed){do things}
注意：轮询任何东西通常都不是最好的解决方案。window.onbeforeunload如果可能，应该使用该事件，唯一需要注意的是，如果您离开，它也会触发。
我需要在浏览器或选项卡关闭时自动将用户注销,但不能在用户导航到其他链接时自动注销.当发生这种情况时,我也不希望显示确认提示.经过一段时间的努力,尤其是IE和Edge,这是我在完成这个答案的方法之后所做的事情(检查使用IE 11,Edge,Chrome和Firefox).
首先,beforeunload在JS 中的事件处理程序中启动服务器上的倒计时器.ajax调用需要同步才能使IE和Edge正常工作.您还需要使用return;以防止确认对话框显示如下:
window.addEventListener("beforeunload", function (e) {
$.ajax({
type: "POST",
url: startTimerUrl,
async: false
});
return;
});
启动计时器会将cancelLogout标志设置为false.如果用户刷新页面或导航到另一个内部链接,cancelLogout则服务器上的标志设置为true.一旦计时器事件过去,它会检查cancelLogout标志以查看注销事件是否已被取消.如果计时器已被取消,那么它将停止计时器.如果浏览器或选项卡已关闭,则该cancelLogout标志将保持为false并且事件处理程序将使用户退出.
实现说明:我正在使用ASP.NET MVC 5,我正在取消重写Controller.OnActionExecuted()方法中的注销.
$(window).unload( function () { alert("Bye now!"); } );
小智 6
抱歉,我无法在现有答案中添加注释,但是如果您想要实现一种警告对话框,我只想提一下,任何事件处理函数都有一个参数 - 事件.在您的情况下,您可以调用event.preventDefault()来禁止自动离开页面,然后发出自己的对话框.我认为这比使用标准的丑陋和不安全的警报()更好.我个人基于kendoWindow对象实现了我自己的一组对话框(Telerik的Kendo UI,几乎完全是开源的,除了kendoGrid和kendoEditor).您还可以使用jQuery UI中的对话框.但请注意,这些事情是异步的,您需要将处理程序绑定到每个按钮的onclick事件,但这很容易实现.
但是,我确实认为缺少真正的关闭事件是非常糟糕的:例如,如果你想在后端重置你的会话状态只是在真正关闭的情况下,这是一个问题.
onunload是Chrome的答案。根据caniuse 的说法，它是跨浏览器的。但并非所有浏览器的反应都相同。
window.onunload = function(){
alert("The window is closing now!");
}
当窗口卸载其内容和资源时，会触发这些事件。
对于铬：
onunload仅在页面关闭时执行。即使在页面刷新和导航到不同页面时它也不会执行。
对于火狐 v86.0：
它根本不会执行。页面刷新，导航离开，关闭浏览器选项卡，关闭浏览器，什么都没有。
对于类似的任务，您可以用来sessionStorage在本地存储数据，直到关闭浏览器选项卡。
该sessionStorage对象仅存储一个会话的数据（关闭浏览器选项卡时将删除该数据）。（W3Schools）
<div id="Notice">
<span title="remove this until browser tab is closed"><u>dismiss</u>.</span>
</div>
<script>
$("#Notice").click(function() {
//set sessionStorage on click
sessionStorage.setItem("dismissNotice", "Hello");
$("#Notice").remove();
});
if (sessionStorage.getItem("dismissNotice"))
//When sessionStorage is set Do stuff...
$("#Notice").remove();
</script>
由于尚未有人提及（8 年多后）：WebSocket 可能是检测关闭选项卡的另一种有效方法。只要选项卡打开并指向主机，客户端就能够与主机保持活动的 WebSocket 连接。
警告：请注意，如果 WebSocket 不需要您已经在做的事情产生任何额外的显着开销，则此解决方案实际上仅适用于项目。
在合理的超时期限内（例如 2 分钟），服务器端可以在 WebSocket 断开连接后确定客户端已离开，并执行所需的任何操作，例如删除上传的临时文件。（在我极其专业的用例中，我的目标是在 WebSocket 连接断开并且所有 CGI/FastCGI 活动终止后三秒终止本地主机应用程序服务器- 任何其他保持活动连接都不会影响我。）
我在让 onunload 事件处理程序与信标一起正常工作时遇到问题（按照此答案的建议）。关闭选项卡似乎不会触发信标，而打开选项卡会以可能导致问题的方式触发信标。WebSocket 更干净地解决了我遇到的问题，因为连接大约在选项卡关闭的同时关闭，并且应用程序内的切换页面只是在延迟窗口内打开一个新的 WebSocket 连接。
| 归档时间： |
|
| 查看次数： |
449658 次 |
| 最近记录： |