使用javascript 点击tab栏切换事件代码记录

最新推荐文章于 2025-04-20 12:48:12 发布

woowen！

最新推荐文章于 2025-04-20 12:48:12 发布

阅读量919

点赞数 5

分类专栏： JavaScript 文章标签： javascript 前端开发语言

本文链接：https://blog.youkuaiyun.com/q1ngqingsky/article/details/134648111

版权

如下图实现以下两点功能：

这里做代码记录

1. javascript 点击tab栏动态切换内容，并添加active

2. javascript 点击左右图标可以向左或者向右移动元素

第1点功能：

// tab栏
<div class="left">
              <span class="tab active" onclick="changeTab('personCon',event)"
                >个人业务</span
              ><span class="tab" onclick="changeTab('publicCon',event)"
                >对公业务</span
              ><span class="tab" onclick="changeTab('licenseCon',event)"
                >证照办理</span
              >
            </div>

// tab栏对应的内容
<div class="tabItem none" id="personCon">
    <div class="business-list">这里是个人业务</div&g