【问题标题】:Can you use JavaScript to detect whether a user has closed a browser tab? closed a browser? or has left a browser?您可以使用 JavaScript 检测用户是否关闭了浏览器选项卡吗?关闭浏览器?还是离开了浏览器?
【发布时间】:2015-04-09 02:47:41
【问题描述】:

把你放在照片里:

  • 用户在移动设备上查看浏览器(即 iPhone 上的 Safari)
  • 他们可以看到密码字段以在模式框中创建密码
  • 如果用户要关闭模式框并退出浏览器,我想向他们发送一封电子邮件,提示他们创建密码。

我最初的想法是必须有某种 java-script 事件才能做到这一点?

因此,您能否使用 JavaScript 检测用户具有的以下用户操作: - 关闭标签 - 关闭他们的浏览器 - 离开他们的浏览器

【问题讨论】:

  • 无论如何都应该重新考虑这种“自动烦人”...
  • 您可以随时在用户的浏览器中设置一个cookie来记录他们是否注册。
  • 同意,如果用户不提交密码,我们确实希望在用户的机器上放置一个 cookie。但是它是第 2 阶段的项目。

标签: javascript jquery browser web


【解决方案1】:

也在寻找问题,但是你不会满足需求。

我刚刚找到了解决这个问题的方法:“你可以使用 JavaScript 来检测用户是否关闭了浏览器选项卡?关闭了浏览器?还是离开了浏览器?”

<html>
<head>
<title>Detecting browser close</title>
<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>
</head>
<body>
<p>
Check which action detects browser window close:
<ol>
<li>Click this <a href="#" onclick="location.reload();return false">Refresh</a> link or the browser's Refresh button</li>
<li>Navigate away from this page through a <a href="http://serverthemes.net/">link</a></li>
<li>Type another URL in the address bar</li>
<li>Click Back or Forward button</li>
<li>Click the Close (X) button in the top-rightmost corner of the browser</li>
<li>Click the IE icon in the top-leftmost corner and choose Close. Or simply double-click the icon</li>
 <li>Press Alt+F4 key</li>
</ol>
 </p>
     <p>In IE, the last 3 actions are correctly detected by the <a href="#" onclick="alert(doUnload);return false">javascript code</a> inside this page as browser close.</p>
    </body>
    </html>

【讨论】:

  • Alt-F4也是一样,关闭导航器(tab或者X)也关闭F5键,回发再重新加载?
  • 此解决方案是否也适用于移动浏览器?我对此表示怀疑。
【解决方案2】:

如果您的用户关闭一个选项卡,您可能会通过 onunload 事件检测到它,但是当她关闭浏览器时,您的 javascript 引擎也会中止,因此您无法再在客户端运行任何类型的程序。

但是,您可以在服务器上检测到它。例如,如果您准备一个 websocket 连接,您可能会检测到您的客户端何时退出,然后执行您想要的操作。

该过程将是这样的:进入页面后,设置到您的服务器的自动 websocket 连接。如果需要,请在输入后阅读电子邮件(您也可以通过 websocket 事件将其发送到服务器),最后,当“断开连接”事件触发时,将电子邮件发送到该地址。

如果您想以这种方式继续,您可能需要查看Socket.IO webpage,这对我来说是实现此过程的最简单方法之一。

【讨论】:

    【解决方案3】:

    简短的回答不是真的,不。长答案是有一个onunload 事件,但你能做的就是询问用户是否确定要离开(参见@EvanKnowles 的评论),但你不能附加任何复杂的逻辑。

    最好的方法是设置某种会话计时器,它会在他们最后一次出现在您的网站上 N 分钟后发送一封电子邮件。

    【讨论】:

    • 这个答案涵盖了所有内容。基本上不可能按照您当前想要的方式进行。除此之外,请不要这样做。只需通过 cookie 或一些服务器端检查再次显示模式框(如果用户尝试登录,但没有密码,则显示框)。不要发送电子邮件(或使用弹出窗口)。
    【解决方案4】:

    为您准备的文件: http://www.openjs.com/scripts/events/keyboard_shortcuts/ shortcut.add("Ctrl+Shift+X",function() { alert("Hi there!"); });

    下载:http://www.openjs.com/scripts/events/keyboard_shortcuts/shortcut.js

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2017-12-17
      • 2011-11-02
      • 1970-01-01
      • 1970-01-01
      • 2017-10-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多