在页面导航中传播开启变量的最佳方法?

时间:2009-05-22 07:42:06

标签: javascript

我正在处理的应用程序有多个模块。两个是一个问题 - 我写的主要模块和模块。我必须在包含主模块的窗口上调用一个函数,问题是我必须不是从父webmodule打开的页面调用该函数,而是从用户从该页面导航的页面调用该函数。

基本上,第一页只显示一些查询表单,让用户进行一些查询,第二页保存查询结果,我应该根据这些结果更新父页面的内容。

导航就像那样

  • 主要模块
  • 我的模块的第一页(我将主模块页面作为window.opener变量。
  • 我模块的第二页(我希望能够在打开第一页的同一浏览器窗口中打开此页面)

我希望尽可能免费导航 - 例如在新标签页中打开查询结果,返回更改查询参数,进行新查询等。我还想在显示结果的页面上显示用户查询表单。让他们改进这个查询,并且仍然能够更新主模块。

我在考虑以下解决方案:

  1. 使用AJAX将查询结果加载到第一个窗口,但我想让这个应用程序尽可能简单,而且AJAX并不简单;)
  2. 针对每个请求生成新窗口并执行var mainModule = opener.mainModule之类的代码。哪个是邪恶的。
  3. 将查询结果嵌入到框架或iframe中,但我对如何将主模块窗口javascript变量注入框架或iframe有一点点了解。

2 个答案:

答案 0 :(得分:2)

如果能够在选项卡中导航是一项要求,我认为您必须使用JavaScript打开的窗口系统。因为当您导航到不同的窗口时,Firefox,Safari和大多数浏览器中的opener属性肯定会丢失。一个新的标签扰乱了整洁的沙箱。

不是要求,根据您的评论,我认为您可以使用以下3种方法之一:

  • 亲子 窗口通讯 - 我会接受 下一个;
  • XMLHTTP请求 (a.k.a. AJAX);或
  • iFrames (旧方法 远程服务器:)

我会在这里采用 家长儿童沟通 角度,因为您似乎最熟悉它。

  1. “儿童”窗口中的导航很容易。
    • 页面上的任何链接都会加载到子项中并共享相同的“开启者”。
    • 父级可以重新加载不同的页面,它共享同一个开启者。
  2. 孩子中会有父母监听功能;
  3. 孩子将有一个单独的可以与父母交谈
  4. 父母将有一个或多个儿童听众,具体取决于具体方式 通用的,或具体的您的需求。
  5. 我已经更新(不完全)我多年前写的一篇文章,让你玩windows并实际做一个最小的表单提交。通讯警报相当冗长;但是你将毫不怀疑谁在向谁传达信息。第一个孩子烦恼地打开了。但是页面上有一个链接可以将子项更改为服务器生成的表单。

    JavaScript: Beyond Parent Child Windows


    示例代码链接:

    链接

    <a href="page1.html" id="newwinlink">open a window from link</a>
    

    链接侦听器

    事件监听器和目标属性在文档的头部设置,在执行onload的JavaScript中:

    var mywin; //global variable for best results
    
    //XDOM - normalizes browser differences:
    var openingLink = XDOM.getElementById('newwinlink');
    openingLink.target = "newWin"; //important!
    
    XDOM.addListener(openingLink, 'click', function(e){mywin=window.open('','newWin','width=400,height=400,resizable,scrollbars');if (!mywin.opener){mywin.opener = self;}return true}, false);
    

    子文档 - 家长监听器

    function parentListener(pmsg) 
    {
        alert("I'm the child, and I just received the following message from my parent:\n\n" + pmsg); 
    }
    

    儿童文件 - 与家长交谈

    function talktoParent() 
    {
        if (self.opener!=null) {
            opener.childListener("Hi from child window!");
        } else {
            alert("no opener... sorry, can't talk now");
        }
    }
    

    父文档 - 儿童监听器

    function childListener(cmsg) 
    {
        alert("I'm the parent. Just received the following message from my child:\n\n" + cmsg);
        //send back a message to the child, mywin...
        mywin.parentListener("Hi, back, from parent window!");
    }
    

    这些都很简单。但您可以在上面提供的链接上看到服务器端回发与父级之间的开启连续性,导航和通信。

    另一个缺点是在另一个标签中打开其中任何一个将失去与父母的连接。在我发给你的页面上试一试。我相信孩子会提醒您它已与“ 开启者 ”断开连接。

    随意提问,jb。

答案 1 :(得分:0)

iirc,即使你在window.open打开的窗口中离开原始文档后,window.opener仍然可用。