在一个页面点击链接跳转至另一个页面的选项卡tab中
2018-03-11 13:00
423 查看
页面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
css <style type="text/css"> *{margin: 0;padding: 0;} #box{width: 300px;margin:100px auto;} input {width: 93px;height: 30px;} #box1{position: relative;} #box1 div{width: 300px;height: 200px;border: 1px solid red;position: absolute;top: 0;font-size: 20px;text-align: center;line-height: 200px;display: none;} #box1 .box1a{display: block;} .btn{background: #000;color: pink;} </style> html <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> jquery <script> // 获取 被访问时的 url var ur =location.href; // 获取该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) 来控制该选项卡的切换 // 其实就是从页面 A 通过 URL ? 后面的参数 给页面B 传一个 index // 下面这些内容就很好理解了 $('#box1 div').css({'display':'none'}); $('input').removeClass('btn'); $('input').eq(type-1).addClass('btn'); $('#box1 div').eq(type-1).css({'display':'block'}); </script
相关文章推荐
- 网站某一目录下mip页面点击全部跳转到同一个链接,可能是什么原因导致的? – SEO每天一贴
- 如何实现点击一个按钮后跳转的指定的链接页面
- iOS 点击一个页面上的按钮跳转到tabBar的另一个页面
- 在页面上点击一个链接,跳转到与指定QQ聊天的功能
- easyui 后台页面,在Tab中的链接点击后添加一个新TAB的解决方法
- extjs 点击链接到另一个页面 并激活另一个页面的指定tab
- 实现在一个页面内,点击导航栏的不同链接,跳转到不同的页面
- ASP.NET MVC WebApi 返回数据类型序列化控制(json,xml) 用javascript在客户端删除某一个cookie键值对 input点击链接另一个页面,各种操作。 C# 往线程里传参数的方法总结 TCP/IP 协议 用C#+Selenium+ChromeDriver 生成我的咕咚跑步路线地图 (转)值得学习百度开源70+项目
- 点击一个按钮,弹出框出现几秒钟之后,跳转到另一个页面
- 点击连接如果连接打不开跳转到另外一个页面的实现
- 如何绑定android点击事件--跳转到另一个页面并实现关闭功能?
- input点击链接另一个页面,各种操作
- 点击datagrid的一行,然后链接到另一个页面
- javascript 一个页面多个tab选项卡效果
- PHP——0128练习相关2——js点击button按钮跳转到另一个新页面
- js点击button按钮跳转到另一个新页面
- ios点击链接直接跳转到 App Store 指定应用下载页面
- viewpager和fragment实现的tab页面如何实现点击跳转
- iOS实现在webview页面内点击链接,跳转指定App
- 点击后退按钮回到本页面中的另一个标签页(tab)