3条回答 默认 最新
- CSDN专家-天际的海浪 2021-09-18 22:24关注
你题目的解答代码如下:(如有帮助,望采纳!谢谢! 点击我这个回答右上方的【采纳】按钮)
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <title> 页面名称 </title> <style type="text/css"> .list p.active{ background-color:#e73839; color:white; } </style> <script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript"> $(function (){ $(".list p").click(function () { //获取点击的元素给其添加样式,讲其兄弟元素的样式移除 $(this).addClass("active").siblings().removeClass("active"); //获取选中元素的下标 var index = $(this).index(); $(".inner .item").eq(index).show().siblings().hide(); }); }); </script> </head> <body> <div class="box"> <div class="list"> <p class="active">1</p> <p>2</p> <p>3</p> <p>4</p> <p>5</p> </div> <div class="inner"> <div class="item">第一块</div> <div class="item" style="display: none;">第二块</div> <div class="item" style="display: none;">第三块</div> <div class="item" style="display: none;">第四块</div> <div class="item" style="display: none;">第五块</div> </div> </div> </body> </html>
本回答被题主选为最佳回答 , 对您是否有帮助呢?解决 无用评论 打赏 举报
悬赏问题
- ¥15 各位请问平行检验趋势图这样要怎么调整?说标准差差异太大了
- ¥15 delphi webbrowser组件网页下拉菜单自动选择问题
- ¥15 wpf界面一直接收PLC给过来的信号,导致UI界面操作起来会卡顿
- ¥15 init i2c:2 freq:100000[MAIXPY]: find ov2640[MAIXPY]: find ov sensor是main文件哪里有问题吗
- ¥15 运动想象脑电信号数据集.vhdr
- ¥15 三因素重复测量数据R语句编写,不存在交互作用
- ¥15 微信会员卡等级和折扣规则
- ¥15 微信公众平台自制会员卡可以通过收款码收款码收款进行自动积分吗
- ¥15 随身WiFi网络灯亮但是没有网络,如何解决?
- ¥15 gdf格式的脑电数据如何处理matlab