如何使这些标签工作

How to make these tabs work?

本文关键字：工作标签何使这更新时间：2023-09-26

我正在学习JS的过程中，决定尝试从头开始编写一个简单的选项卡。

我有两个函数。一个用于将类'active'添加到每个选项卡，另一个用于通过单击导航

中的li触发此功能。

这是我的代码
https://codepen.io/Allan11/pen/Bzvxya

问题是类切换似乎没有正确的工作方式。你能告诉我正确的方向如何修复它，或者也许只是我的方法来这些功能是错误的，有一个更简单的方法来做到这一点?

如果您想以这种方式编写，则需要通过在处理程序中添加参数并查看此srcElement来捕获引发单击事件的元素。这将告诉您单击了哪个li项。但是，您需要找到一种方法来识别哪些内容属于这个li项，并为它分配.active类，并从所有其他类中删除该类。我个人会使用一个共享类或一个数据项来完成这个任务。

然而，所有这些似乎都是在尝试做一些已经在jQuery和jQuery UI框架中完美存在的事情。除非你有一个非常好的理由重新发明轮子，否则我会使用jQuery UI。