伸缩--也可用于tabs

最新推荐文章于 2025-05-31 12:07:01 发布

comeonstone

最新推荐文章于 2025-05-31 12:07:01 发布

阅读量875

点赞数

CC 4.0 BY-SA版权

分类专栏： jquery js 文章标签：前端开发 jquery

本文链接：https://blog.youkuaiyun.com/comeonstone/article/details/40264333

js 同时被 2 个专栏收录

45 篇文章

订阅专栏

jquery

33 篇文章

订阅专栏

本文介绍了一种使用jQuery实现的选项卡切换效果。通过监听用户的鼠标悬停事件，为当前选项卡添加高亮显示，并根据索引显示对应的内容区域，同时隐藏其他内容。此外，还实现了列表项状态的切换。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

var $ranklist_li = $("div.ranklist_model ul li");
            $ranklist_li.hover(function () {
                $(this).addClass("current").siblings().removeClass("current");
                var index = $ranklist_li.index(this);    //获取当前点击li元素在全部li元素中的索引
                $("div.tab_box > div").eq(index).show().siblings().hide();
            });

            var $list_li = $(".m_list li");
            $list_li.hover(function () {
                $(this).addClass("eat_me").removeClass("drink_me").siblings().removeClass("eat_me").addClass("drink_me");
            });

记录一下，方便之后查看