如何确保用户无法随时打开多个弹出窗口？

I have a page that lists uploaded attachments and an icon next to each attachment that opens a popup window (when clicked) to allow the user to edit assorted attachment information for each attachment.

我有一个列出上传附件的页面和每个附件旁边的图标,用于打开弹出窗口(单击时),以允许用户编辑每个附件的各种附件信息。

My questions are:

我的问题是:

How do I ensure that the user is allowed to open only one popup window at any one time

如何确保允许用户一次只打开一个弹出窗口
When the user tries to open another popup window, an alert will pop up and tell him/her that they aren't allowed to open more than one window.

当用户尝试打开另一个弹出窗口时,会弹出一个警告并告诉他/她不允许打开多个窗口。

5 个解决方案

#1

You can use a "handle" to the window and check if it is open or not, here is a sample:

您可以使用窗口的“句柄”并检查它是否打开,这是一个示例:

var vWin = null;
var msWindowUsedMessage = "A previous action was not completed.\nClose the window and try again.";

function IsWindowUsed(oWindowToCheck) { 
    if (!oWindowToCheck.closed && oWindowToCheck.location) { 
        alert(msWindowUsedMessage); 
        oWindowToCheck.focus(); 
        return true;
    } 
    return false;
}
function Open_New_Window(sUrl, sTitle, sParams) {
    var winLeft = top.screenLeft + 50;
    var winTop = top.screenTop + 50;
    var oWindowHandle = window.open(sUrl, "", sParams + ",toolbar=no,top=" + winTop + ",left=" +  winLeft); 
    oWindowHandle.opener = self; 
    return oWindowHandle;
}

function Add() { 
    if (IsWindowUsed(vWin)){ 
        return;
    } 
    var sParams = "width=380,height=10,status=no,resizable=yes"; 
    var sUrl = "add.aspx";
    vWin = Open_New_Window(sUrl, 'Add', sParams);
}

#2

Give the popup a name when you are opening it. This will force any subsequent clicks to open in the same popup window. You can then implement the window.unload event to prevent users from navigating away from the page that is currently being saved.

打开时为弹出窗口命名。这将强制在同一弹出窗口中打开任何后续点击。然后,您可以实现window.unload事件,以防止用户导航离开当前正在保存的页面。

If you are using jQuery though I would suggest you use the ui.dialog to provide the functionality in the page. Then you will also force the users down a one at a time edit.

如果您使用的是jQuery,我建议您使用ui.dialog在页面中提供功能。然后,您还将强制用户逐个编辑一个。

#3

When you create a new popup, set variable to point to the new window and then check if it has been closed or not:

创建新弹出窗口时,将变量设置为指向新窗口,然后检查它是否已关闭:

var currentPopup = null;

function openPopup(){

    //test that we have either not opened a popup or have closed it.
    //references to closed windows don't disapear, but have their closed property set to true.
    if(!currentPopup || currentPopup.closed){

        //set the new currentPopup variable to reference the new window.
        currentPopup = window.open(...);
     }
     else{
         //A window is open! Display error message.
         //for the best user experience use a nice way to display the message as opposed to using an alert();

    }
}

#4

Why not make each popup modal so that it has to be dismissed before you can interact with the main page. This would be pretty easy to do with the jQuery Dialog plugin, but you could also make your own with some javascript/css magic.

为什么不制作每个弹出模式,以便在与主页交互之前必须将其解除。使用jQuery Dialog插件可以很容易,但你也可以使用一些javascript / css魔法制作自己的插件。

#5

Create a cookie or global (client or server-side based on your needs) flag and check if it's set each time the popup is triggered.

根据您的需要创建一个cookie或全局(客户端或服务器端)标志,并检查每次触发弹出窗口时是否设置它。

#1