按下按钮时，使用Javascript突出显示HTML中的选项卡

我在网页的一部分中有三个选项卡-信息、问题、订单。单击任何选项卡标题时，只有选定的选项卡高亮显示。我在信息部分有两个按钮，链接到问题和订单选项卡。按下按钮时，相应的选项卡将正确显示，但不会突出显示相应的选项卡


这是问题站点的URL，3个选项卡位于页面右侧：



我确实尝试了一个引导代码，但也没有很好地工作

非常感谢您的帮助

函数openProductTab（evt，tabName）{
var i，tabcontent，openProductTab；
tabcontent=document.getElementsByClassName（“tabcontent”）；
对于（i=0；i

/*----------------------*/
/*---Produktabbar------*/
/*----------------------*/
塔布杜克特先生{
溢出：自动；
}
/*----------选项卡按钮---------*/
.选项卡产品按钮{
颜色：#1e84d8；
/*边缘底部：0像素*/
背景色：#e7f6ff；
浮动：左；
光标：指针；
过渡：0.1s；
宽度：33%；
边框顶部：1px实心#ebebeb；
左边框：1px实心#ebebebeb；
边界权：无；
边框底部：1px实心#20a3eb；
}
.tabProducts按钮：悬停{
颜色：白色；
背景色：#20a3eb；
}
.tabProducts按钮。激活{
颜色：#1e84d8；
宽度：33%；
背景色：白色；
边框顶部：1px实心#20a3eb；
左边框：1px实心#20a3eb；
右边框：1px实心#20a3eb；
边框底部：无；
}
.tabProducts按钮。活动：悬停{
颜色：#20a3eb；
}
/*设置选项卡内容的样式*/
.tabcontent{
显示：无；
填充：0px 0px；
}
塔布勒先生{
左边距：0px；
}
塔布里先生{
列表样式：无；
}
.TAB内容h3{
底边：点状；
边框底宽：1px；
边框颜色：#20a3eb；
文本对齐：左对齐；
填充顶部：20px；
垫底：5px；
边缘底部：5px；
字号：18px；
}
.TabH4{
颜色：#515151；
}

[icon name=“info circle”class=”“unfixed_class=”“]info[icon name=“question circle”class=“”unfixed_class=”“]Frågor[icon name=“shopping cart”class=“”unfixed_class=”“]最佳

[icon name=“info circle”class=”“unfixed_class=”“]产品信息
[icon name=“clock-o”class=“blue1ColorClass”unfixed_class=”“]LeverNSTID:1-2 veckor
[icon name=“arrow-circle-o-down”class=“blue1ColorClass”unfixed_class=”“]意大利明斯塔：100街
[icon name=“adjust”class=“blue1ColorClass”unfixed_class=”“]Färger:[icon name=“circle”class=“blueColorClass”unfixed_class=”“][icon name=“circle”class=“redColorClass”unfixed_class=”“][icon name=“circle”class=“blackColorClass”unfixed_class=”“]
尼德拉德宁购物中心：


你是说你的产品最好吗
Jag har fler frågor[图标名称=“问题圈”class=”“unfixed_class=”“]
Beställ nu[icon name=“shopping cart”class=”“unfixed_class=”“]


[icon name=“问题圈”class=”“unfixed_class=”“]Jag har några frågor först
请将最好的产品介绍给我们的合作伙伴webbenär inte alltid en dans pårosor。这是一个非常好的解决方案。斯奇卡在迪纳·芬德林加，途经康塔克特福德·穆勒特·特科默·雷特，直到挖！杜卡尼文·林加·奥斯·佩斯（på，maila till）kundservice@prendo.seeller skriva直到oss direkt i chattenär denär bemannad.[contact-form-7 id=“6”title=“KONTAKTA oss”]


[icon name=“shopping cart”class=”“unfixed_class=”“]最佳选择
这是我的最爱！Väljönskad变型och antal och lägg轿车，直到生产varukorgen。这是一个很好的解决方案，它是一个很好的解决方案

改用类列表：

加上：

evt.currentTarget.classList.add("mystyle");

删除：

evt.currentTarget.classList.remove("mystyle");

要切换：

evt.currentTarget.classList.toggle("mystyle");

取代：

evt.currentTarget.classList.replace( oldClass, newClass );

---

可以找到更多信息。

您只需在单击的按钮上设置

活动

类，但还需要为“实际”选项卡按钮设置该类。（分别找出如何到达tab按钮，但不确定实际单击的按钮在这种情况下是否需要它。）