在HTML Windows之间导航

时间:2010-12-14 17:08:06

标签: javascript html

并感谢您看一下这个看似简单的问题。

场景如下:我有一个名为'welcome.html'的网站主页。从这里,用户可以从URL列表中进行选择,点击URL可以调用一个简单的Javascript函数,打开一个新窗口。

一旦用户完成了新打开的窗口,我希望他们点击一个调用Javascript函数的按钮将它们返回到主页。看起来很简单。

但是,如果主页窗口仍处于打开状态,我想返回此状态,而不打开另一个显示主页的新窗口。如果主页窗口已关闭,那么我想打开一个新窗口显示主页。

我非常感谢这里的一些指导,因为我似乎无法让它发挥作用。

此致

克里斯

2 个答案:

答案 0 :(得分:1)

正如其他人所说,这不是最伟大的设计。但是,我在过去遇到过这样的场景,业务逻辑规定必须打开一个新窗口,并且没有能力改变它。

正如Pointy所说,最重要的只是跟踪打开的窗户,如果你需要一些进一步的帮助,也许这可能会有所帮助: http://www.quirksmode.org/js/popup.html

但是如果可能的话,我会考虑一个不同的设计(如果你需要帮助实现它,请在这里询问!)

答案 1 :(得分:1)

感谢所有分享他们想法的人。

我通过以下方式解决了问题:

从主页导航到新窗口时,以下Javascript用于打开新窗口:

function popupFull(url)

// For explanation of this code see: http://www.quirksmode.org/js/popup.html

// Note: If fullscreen = 1 you can't see the menubar, toolbar, status etc.
// It is advisable to have no spaces around the commas in the parameters.

{
    //alert("Opening: " + url)

    // Prepare the parameter string
    params = 'width='+screen.width;
    params += ',height='+screen.height;
    params += ',top=0,left=0';
    params += ',fullscreen=0';
    params += ',menubar=0';
    params += ',toolbar=0';
    params += ',directories=0';
    params += ',status=0';
    params += ',scrollbars=0';
    params += ',resizable=1';

    // Open a new window.
    newWin=window.open(url, "fullWindow", params);

    // If the current Window is in focus, switch focus to the new Window.
    if (window.focus)
    {
        newWin.focus()
    }

    // Return the new Window object reference.
    return newWin;
}

所以新窗口可以打开,我已经打开了主页窗口,但是在新窗口后面没有焦点。

在新窗口中有一个“菜单”按钮。单击此按钮将调用以下Javascript函数:

function openMenu(winURL, winName, winFeatures)
{
// Create a reference of the Window which opened this Window. This should be
// the Main Menu Window.
var winObj=window.opener;

var menuOuterWidth = 1080;
var menuOuterHeight = 896;

var menuInnerWidth = 1068;
var menuInnerHeight = 767;

var menuX = (screen.width - menuOuterWidth) / 2;
var menuY = (screen.height - menuOuterHeight) / 2;

// Prepare the parameter string for re-opening the Menu
params = 'width='+menuInnerWidth;
params += ',height='+menuInnerHeight;
params += ',top='+menuY+',left='+menuX;
params += ',fullscreen=0';
params += ',menubar=1';
params += ',toolbar=1';
params += ',status=1';
params += ',scrollbars=1';
params += ',location=1';
params += ',resizable=1';

try
{
    // Check to see if the window reference already exists.
    if (winObj)
    {
        // Check to see if the Menu window is closed.
        if (winObj.closed)
        {
            // The Menu window is closed.
            // Open the Menu Window.
            winObj = window.open(winURL, winName, params);

            // Close this Course Window.
            window.close();

            // Return the Menu Window object reference should the caller want it.
            return winObj;
        }
        else
        {
            // The Menu Window has not been closed. Set the Window's size and position.
            // Note: When resizing the outerWidth/outerHeight value has to be passed.
            winObj.window.resizeTo(menuOuterWidth, menuOuterHeight);
            winObj.window.moveTo(menuX, menuY);

            // Bring it into focus (bring to front). 
            winObj.focus();

            // Close this Course Window.
            window.close();

            // Return the Menu Window object reference should the caller want it.
            return winObj;
        }
    }

    else

    {

        // The winObj object does not exist. Open the Menu.
        winObj = window.open(winURL, winName, params);

        // Close this Course Window.
        window.close();

        // Return the Menu Window object reference should the caller want it.
        return winObj;
    }
}

catch(err)
{
    txt="There was an error on this page.\n\n";
    txt+="Error description: " + err.description + "\n\n";
    txt+="Click OK to continue.\n\n";
    //alert(txt);

    // When IE6 tries to obtain the winObj.closed property, when the window is closed, it can cause
    // an error "Permission Denied". This error is caught here. Open the Menu.

    // Open the Menu Window.
    winObj = window.open(winURL, winName, params);

    // Close this Course Window.
    window.close();

    // Return the Menu Window object reference should the caller want it.
    return winObj;
}

}

评论应该解释一切。关键是要获得我们开始的主页窗口的引用。 (var winObj=window.opener;)。

是什么让我头疼的是,如果我打开新窗口(使用IE6),切换回主页并关闭主页窗口,然后在新窗口中单击“菜单”按钮没有任何反应!我尝试了一切,然后,喝了一杯茶,意识到我永远不会在我正在开发的任何应用程序中编写代码,而不会有任何形式的错误捕获。我添加了一个Try,Catch语句,并在“警报”中报告错误。我收到了“权限被拒绝”错误。

经过大量阅读后,我想我无法消除错误,我会尽可能优雅地处理错误。这导致了上面的代码。

这是一种享受,我希望这有助于某人。