积极答复者
多个页面共用一个子窗口

问题
-
想做多个父窗口共用一个子窗口而且子窗口页面不刷新的功能。
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来获得子窗口的句柄?
问题虽有些怪异,但确实有实用,谢谢了?
答案
-
通过隐藏窗口是可以实现的
按照下面的做法即可,注意创建的文件名要一致:更多控制可以自己来扩展。
在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
孟宪会- 已标记为答案 KeFang Chen 2009年3月24日 9:02
全部回复
-
通过隐藏窗口是可以实现的
按照下面的做法即可,注意创建的文件名要一致:更多控制可以自己来扩展。
在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
孟宪会- 已标记为答案 KeFang Chen 2009年3月24日 9:02