一个页面跳转到另一个页面的tab选项卡的指定页上

最新推荐文章于 2023-08-24 15:38:58 发布

砂锅大的拳头

最新推荐文章于 2023-08-24 15:38:58 发布

阅读量1.3k

点赞数

分类专栏： web

本文链接：https://blog.csdn.net/weixin_43343423/article/details/99704111

版权

web 专栏收录该内容

34 篇文章 0 订阅

订阅专栏

在这里插入图片描述

页面 A
<body>
<a href="选项卡-练习.html?type=1">1111111111</a>
<a href="选项卡-练习.html?type=2">2222222222</a>
<a href="选项卡-练习.html?type=3">3333333333</a>
</body>
页面B
<body>
<div id="box">
<input type="button" name="" value="11111" class="btn">
<input type="button" name="" value="22222">
<input type="button" name="" value="33333">
<div id="box1">
<div id="1" class="box1a">1111111111</div>
<div id="2">222222222222</div>
<div id="3">33333333333333</div>
</div>
</div>
</body>
<script>
// 获取页面 A 访问的 url
var ur =location.href;
// 获取页面 A 访问的 url 的 = 后面的 数字 （对应着这个页面的 id）
var type=ur.split('?')[1].split("=")[1];
// 选项卡
$('input').click(function(event) {
$('input').removeClass('btn');
$(this).addClass('btn');
$('#box1 div').css({'display':'none'});
$('#box1 div').eq($(this).index()).css({'display':'block'});
});
// 使用传过来的 id 来控制该选项卡的切换
$('#box1 div').css({'display':'none'});
$('input').removeClass('btn');
$('input').eq(type-1).addClass('btn');
$('#box1 div').eq(type-1).css({'display':'block'});
</script>