none
多个页面共用一个子窗口 RRS feed

  • 问题

  • 想做多个父窗口共用一个子窗口而且子窗口页面不刷新的功能。

    http://www.google.cn/music/chartlisting?q=new_songs_cn&cat=song
    这是google的音乐频道,当你点击其中一首歌试听时它会弹出一个播放子窗口
    如果你在另一个新标签页或新窗口中打开如上同一个页面再点其中一首歌试听
    那么它会共用同一个播放子窗口,并且子窗口的页面不刷新
    有谁知道它是怎么做到的?
    如:
    A.html页面,触发事件打开子窗口A_sub.html页面
    如果这时你刷新A.html页面(不要关掉子页面),再触发事件打开A_sub.html子页面,这时A_sub.html子是会刷新的,但用的还是以前那个窗口
    而google能做到不刷新


    再者语句
    var subWinHandler = window.open("www.microsoft.com", "subWinName", "alwaysRaised=yes")
    如何在父窗口通过名字subWinName来获得子窗口的句柄?

    问题虽有些怪异,但确实有实用,谢谢了?
    2009年3月18日 3:24

答案

  • subWinHandle.document.getElementById("xxx").innerHTML

    subWinHandler 就是代表子窗口的对象,可以修改里面的任何内容

    点击的时候先判断窗口是否存在,如果存在就修改内容,否则open一个新窗口

    孟宪会
    2009年3月18日 10:00
    版主
  • 通过隐藏窗口是可以实现的

    按照下面的做法即可,注意创建的文件名要一致:更多控制可以自己来扩展。
    在ie7,ie8,ff3下测试通过

    index.htm
    =============================
    <script>
    function p()
    {
    window.open("a.htm?music=" + (new Date()).toString(),"mxh","width=600,height=300")
    }
    </script>
    <input type=button onclick='p()' value='open' />

    a.htm
    =================================
    <body>
    <script>
    if( window.location.href == window.top.location.href)
    {
        self.top.location.href="b.htm" + window.location.search
    }
    else
    {
        window.parent.frames["mxh2"].setMusic(window.location.search)
    }
    </script>
    Window A
    </body>


    b.htm
    =========================================
    <iframe name="mxh2" src="c.htm"></iframe>
    <iframe name="mxh" src="d.htm" style='display:none'></iframe>
    <script>
        alert("refresh detected")
    </script>
    Window B

    c.htm
    ================================
    <body>
        <div id=xx>init</div>
    <script>
    function setMusic(str)
    {
        document.getElementById("xx").innerHTML = str
    }
    </script>
    Window C

    d.htm
    =======================================
    <script>
        window.name="mxh"
        window.top.name=""
        window.top.focus()
    </script>
    window D

    孟宪会
    2009年3月19日 6:45
    版主

全部回复

  • subWinHandle.document.getElementById("xxx").innerHTML

    subWinHandler 就是代表子窗口的对象,可以修改里面的任何内容

    点击的时候先判断窗口是否存在,如果存在就修改内容,否则open一个新窗口

    孟宪会
    2009年3月18日 10:00
    版主
  • 这种在不新开页面或不刷新页面的情况下是可行的
    但如果这时候A.html页面被刷新或在另一个窗口打开的话
    这时此新页面上的subWinHandler是空的
    再看我举的例子

    2009年3月19日 3:25
  • 通过隐藏窗口是可以实现的

    按照下面的做法即可,注意创建的文件名要一致:更多控制可以自己来扩展。
    在ie7,ie8,ff3下测试通过

    index.htm
    =============================
    <script>
    function p()
    {
    window.open("a.htm?music=" + (new Date()).toString(),"mxh","width=600,height=300")
    }
    </script>
    <input type=button onclick='p()' value='open' />

    a.htm
    =================================
    <body>
    <script>
    if( window.location.href == window.top.location.href)
    {
        self.top.location.href="b.htm" + window.location.search
    }
    else
    {
        window.parent.frames["mxh2"].setMusic(window.location.search)
    }
    </script>
    Window A
    </body>


    b.htm
    =========================================
    <iframe name="mxh2" src="c.htm"></iframe>
    <iframe name="mxh" src="d.htm" style='display:none'></iframe>
    <script>
        alert("refresh detected")
    </script>
    Window B

    c.htm
    ================================
    <body>
        <div id=xx>init</div>
    <script>
    function setMusic(str)
    {
        document.getElementById("xx").innerHTML = str
    }
    </script>
    Window C

    d.htm
    =======================================
    <script>
        window.name="mxh"
        window.top.name=""
        window.top.focus()
    </script>
    window D

    孟宪会
    2009年3月19日 6:45
    版主
  • 非常感谢
    来这论坛果然没白来,还发现了高手
    版主很敬业很热心
    衷心地赞一个

    2009年3月20日 2:42
  • 太神奇了,版主你的研究精神深深打动了我,谢谢
    2009年9月16日 6:47