我在 Chrome 上的重复选项卡（会话的内容）上遇到问题，我想避免重复选项卡的操作（或缺少关闭重复选项卡的操作）。我正在打开选项卡，因为它是一个弹出窗口，没有地址栏，没有状态栏，也什么都没有，只有窗口。在 IE 和 Firefox（至少我还没有找到）中无法复制选项卡（作为弹出窗口打开），但在 chrome 中仍然可以。
I also know I'm not able to programmatically check if there's an already open duplicated tab
知道如何解决这个问题吗？
谢谢！
【问题讨论】：
标签： javascript jquery tabs cross-browser duplicates
在onLoad 函数中，我使用window.performance.getEntriesByType("navigation")[0]).type 来检查浏览器中的重复标签。
如果类型值为back_forward，则该值为重复选项卡。
我为谁担心。
var navigationType = (window.performance.getEntriesByType("navigation")[0]).type;
//back_forward value is duplicate tab
if(navigationType == 'back_forward'){
alert('Can not concurrent edit dashboard...');
}
【讨论】：
reload
如果您想阻止多个标签（重复或不重复），您可以使用此处接受的答案的组合，以及此问题的解决方案之一： https://stackoverflow.com/a/11008432/1257546
我知道我的解决方案，带有本地和会话存储，对我有用 :-)
如果您必须在多个浏览器中检测会话，则需要一个服务器端解决方案。
【讨论】：
我的应用程序要求用户只能登录一次，以便我可以使用 localStorage 可靠地缓存记录。登录使用 localStorage 标志来强制执行此要求，并使用 window.name 来了解哪个用户拥有该选项卡。
问题是浏览器重复选项卡功能搞砸了执行。如果重复登录会话，下面的代码会强制登录页面出现在重复的选项卡中。
此解决方案已在 Chrome 中进行了测试。它利用了重复选项卡没有名称的事实。 此特性可能并非在所有浏览器中都存在。
preventDuplicateTab 函数在页面加载序列的早期被调用。
/* This prevents users from duplicating the tab. If they do it
* triggers the start page which checks for duplicate userid
*/
function preventDuplicateTab() {
if (sessionStorage.createTS) {
// Chrome at least has a blank window.name and we can use this
// signal this is a duplicated tab.
console.log("Existing sessionStorage "+sessionStorage.createTS+"
w.name="+window.name);
if (!window.name) {
window.name = "*ukn*";
sessionStorage.createTS = Date.now(); // treat as new
window.location = "/res/Frame.htm?page=start.htm"; // force to
signon screen
}
} else {
sessionStorage.createTS = Date.now();
console.log("Create sessionStorage "+sessionStorage.createTS+"
w.name="+window.name);
}
}
【讨论】：
目标
澄清一下：目标是检测（并关闭）已通过 Chrome 的“复制”右键菜单选项打开的选项卡。
第一次尝试
“复制标签”操作的工作方式几乎与用户单击“后退”然后“前进”后重新加载页面时完全相同，因此您基本上是在实现this question 的版本：
function onLoad()
{
if ($('#myStateInput').val() === '') // Load with no state.
$('#myStateInput').val('already loaded'); // Set state
else
alert("Loaded with state. (Duplicate tab or Back + Forward)");
}
这很好，但您只是想要检测“复制标签”的时间。为此，我们可以将onbeforeunload 中的状态置空。这是因为 onbeforeunload 仅在用户单击“后退”或“前进”时才会被调用，而在复制选项卡时不会被调用。
第二次尝试
function onLoad()
{
if ($('#myStateInput').val() === '') // Load with no state.
$('#myStateInput').val('already loaded'); // Set state
else
alert("Duplicate tab! Do something.");
$(window).on('beforeunload', function() // Back or Forward buttons
{
$('#myStateInput').val(''); // Blank the state out.
});
}
【讨论】：