如何用JavaScript控制另一页面的层显示隐藏

有2个页面a.html与b.html，想实现的效果是b页面三个链接控制3个层的显示，a页面的3个链接通过参数控制b页面的层的显示。现在b页面内部控制可以实现，但用a来控制... 有2个页面a.html与b.html，想实现的效果是b页面三个链接控制3个层的显示，a页面的3个链接通过参数控制b页面的层的显示。现在b页面内部控制可以实现，但用a来控制b就不行了，请教是为什么呢？

b.html源文件如下：

<html>
<head>
<title>测试</title>
<script>
function ShowDiv(divi)
{
var detail_1= document.getElementById("div1");
var detail_2= document.getElementById("div2");
var detail_3= document.getElementById("div3");
if(divi==1)
{
detail_1.style.display ="block";
detail_2.style.display ="none";
detail_3.style.display ="none";
}

if(divi==2)
{
detail_1.style.display ="none";
detail_2.style.display ="block";
detail_3.style.display ="none";
}

if(divi==3)
{
detail_1.style.display ="none";
detail_2.style.display ="none";
detail_3.style.display ="block";
}
}
var url=document.location.href
kk=url.split("=")
switch (kk[1])
{
case "1": //id=1时的动作
ShowDiv(1);
break
case "2"://id=2时的动作
ShowDiv(2);
break
case "3"://id=3时的动作
ShowDiv(3);
break
default:
ShowDiv(1);
}
</script>
</head>

<body>
<div>
<a href="#" onclick="ShowDiv(1);">显示div1</a>
<a href="#" onclick="ShowDiv(2);">显示div2</a>
<a href="#" onclick="ShowDiv(3);">显示div3</a>
</div>
<div id="div1" style="line-height:30px;color:#0f111a;display:block;">我是div1，啦啦啦~</div>
<div id="div2" style="line-height:30px;color:#798144;display:none;">我是div2，啦啦啦~</div>
<div id="div3" style="line-height:30px;color:#e73024;display:none;">我是div3，啦啦啦~</div>
</body>
</html>

a.html源文件如下：
<html>
<head>

<title>测试0</title>

</head>

<body>

<div>
<a href ="b.html?display=1">div1</a>
</div>

<div>
<a href ="b.html?display=2">div2</a>
</div>

<div>
<a href ="b.html?display=3">div3</a>
</div>

<div>
<a href ="b.html">默认</a>
</div>

</body>

</html> 展开

 我来答

3个回答

#热议# 不吃早饭真的会得胆结石吗？

hlsblog
推荐于2016-06-21 · 超过19用户采纳过TA的回答

知道答主

回答量：60

采纳率：0%

帮助的人：52.2万

我也去答题访问个人页

关注

展开全部

<html>
<head>
<title>测试</title>
<script>
function ShowDiv(divi)
{
var detail_1= document.getElementById("div1");
var detail_2= document.getElementById("div2");
var detail_3= document.getElementById("div3");
if(divi==1)
{
detail_1.style.display ="block";
detail_2.style.display ="none";
detail_3.style.display ="none";
}

if(divi==2)
{
detail_1.style.display ="none";
detail_2.style.display ="block";
detail_3.style.display ="none";
}

if(divi==3)
{
detail_1.style.display ="none";
detail_2.style.display ="none";
detail_3.style.display ="block";
}
}
window.onload = function(){
var url=document.location.href
kk=url.split("=")
switch (kk[1])
{
case "1": //id=1时的动作
ShowDiv(1);
break
case "2"://id=2时的动作
ShowDiv(2);
break
case "3"://id=3时的动作
ShowDiv(3);
break
default:
ShowDiv(1);
}
}
</script>
</head>

<body>
<div>
<a href="#" onclick="ShowDiv(1);">显示div1</a>
<a href="#" onclick="ShowDiv(2);">显示div2</a>
<a href="#" onclick="ShowDiv(3);">显示div3</a>
</div>
<div id="div1" style="line-height:30px;color:#0f111a;display:block;">我是div1，啦啦啦~</div>
<div id="div2" style="line-height:30px;color:#798144;display:none;">我是div2，啦啦啦~</div>
<div id="div3" style="line-height:30px;color:#e73024;display:none;">我是div3，啦啦啦~</div>
</body>
</html>

b.html改成这样就行了，那是因为dom还没有加载完你就执行了，只要把
var url=document.location.href
kk=url.split("=")
switch (kk[1])
{
case "1": //id=1时的动作
ShowDiv(1);
break
case "2"://id=2时的动作
ShowDiv(2);
break
case "3"://id=3时的动作
ShowDiv(3);
break
default:
ShowDiv(1);
}
放到
window.onload = function(){
//上面代码
}
里面，等到页面加载完执行就行了。

已赞过 已踩过<

评论收起

百度网友1a7366ceb
2011-07-06 · 超过24用户采纳过TA的回答

知道答主

回答量：77

采纳率：0%

帮助的人：61.5万

我也去答题访问个人页

关注

展开全部

浏览器端的页面JS只运行在本页，或有父子关系的页面。如果a.html和b.html没有父子关系，那就做不的。再不就是通过ajax配合服务器端程序来实现。

已赞过 已踩过<

评论收起

xueneng60
2011-07-06 · TA获得超过392个赞

知道答主

回答量：290

采纳率：0%

帮助的人：114万

我也去答题访问个人页

关注

展开全部

首先页面打开后后显示一层中的内容，当点击一个连接后再显示另一个层？求

已赞过 已踩过<

评论收起

更多回答（1）

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

如何用JavaScript控制另一页面的层显示隐藏

其他类似问题

为你推荐：