在HTML/CSS/javascript中，当在子选项卡中的选项卡上单击鼠标并将鼠标悬停时，代码未按预期工作_Javascript_Jquery_Html_Css_Tabs

在HTML/CSS/javascript中，当在子选项卡中的选项卡上单击鼠标并将鼠标悬停时，代码未按预期工作

javascript jquery html css tabs

在HTML/CSS/javascript中，当在子选项卡中的选项卡上单击鼠标并将鼠标悬停时，代码未按预期工作,javascript,jquery,html,css,tabs,Javascript,Jquery,Html,Css,Tabs,我在HTML/CSS/Javascript中面临显示选项卡的子选项卡内容数据的问题，让我简要描述一下我的场景：请先执行代码段：那么，现在发生了什么：当您将鼠标悬停在选项卡数据上时，它将显示3个选项卡。然后单击每个选项卡将以粗体显示其侧选项卡以及第一行的相应文本数据，而无需将鼠标悬停在侧选项卡上问题：一旦您开始将鼠标悬停在侧标签上，它就会出现故障。它将向您显示其各自的数据，但当您单击第一次加载时，它将停止在其他选项卡中显示第一行数据及其文本内容。将鼠标悬停在侧标签上时，其工作正常我想要的：

我在HTML/CSS/Javascript中面临显示选项卡的子选项卡内容数据的问题，让我简要描述一下我的场景：

请先执行代码段：

那么，现在发生了什么：当您将鼠标悬停在选项卡数据上时，它将显示3个选项卡。然后单击每个选项卡将以粗体显示其侧选项卡以及第一行的相应文本数据，而无需将鼠标悬停在侧选项卡上

问题：一旦您开始将鼠标悬停在侧标签上，它就会出现故障。它将向您显示其各自的数据，但当您单击第一次加载时，它将停止在其他选项卡中显示第一行数据及其文本内容。将鼠标悬停在侧标签上时，其工作正常

我想要的：因此，基本上每当我点击选项卡时，顶部第一行/列的侧选项卡数据（粗体）及其各自的内容文本应该始终可见

很抱歉，我可能无法以更好的方式解释，请运行代码片段来理解我要说的内容

函数tabmenuevt，tabname{ var i，tabcontent，tablinks； tabcontent=document.getElementsByClassNametabcontent；对于i=0；ia{ 填充：11px；字体大小：14px；显示：块；大纲：0；文字装饰：无；颜色：白色； } 菜单li：将鼠标悬停在a上{ 颜色：黑色； } /*下降*/ .下拉菜单\工作\菜单 { 浮动：对；位置：绝对位置；左：-999em；/*隐藏下拉列表*/ 文本对齐：左对齐；填充：10px 20px 10px 20px；边框：1px实心7777；边界顶部：无；背景：ffffff；边界半径：0px 5px 5px； } .dropdown_work_菜单{宽度：400px；} 菜单li：悬停。下拉菜单\u工作\u菜单 { 左：-1px；顶部：自动； } /*设置选项卡的样式*/ 分区选项卡{ 溢出：隐藏； } /*设置选项卡内按钮的样式*/ div.tab按钮{ 背景色：继承；浮动：左；边界：无；大纲：无；光标：指针；过渡：0.3s；字号：17px；右边距：57px；填充：0px； } /*更改悬停按钮的背景色*/ div.tab按钮：悬停{ 边框底部：3倍实心ffcc00； } /*创建活动/当前tablink类*/ div.tab button.active{ 边框底部：3倍实心ffcc00； } /*设置选项卡内容的样式*/ .tabcontent{ 显示：无；右边距：15px；边缘顶部：6px； } /*设置侧栏的样式*/ 分区侧表{ 浮动：左；右边框：1px实心aaa；宽度：26%；高度：180像素； } /*设置侧选项卡内按钮的样式*/ div.sidetab按钮{ 背景色：继承；显示：块；颜色：黑色；宽度：100%；边界：无；大纲：无；文本对齐：左对齐；光标：指针；字号：17px；填充：0px； } div.sidetab按钮：悬停{ 字体大小：粗体； } /*创建活动/当前tablink类*/ div.sidetab button.active{ 字体大小：粗体； } /*设置侧栏内容的样式*/ .侧栏内容{ 浮动：左；填充：0px 12px；边界：无；宽度：74%；左边界：无；高度：180像素；显示：无；奥特派-我们知道！表1 表2 表3 侧标签1 侧片2 侧片3 侧面选项卡11内容描述

侧标签-12内容描述

侧标签13内容描述

侧标签1 侧片2 侧片3 侧标签21内容描述

侧标签22内容描述

侧标签23内容描述

侧标签1 侧片2 侧片3 侧标签31内容描述

侧标签-32内容描述

侧标签-33内容描述

//获取id=defaultOpen的元素并单击它 document.getElementByIddefaultOpen.click；

当sidemenu函数更改所有sidetabcontent项的样式以隐藏它们时，就会出现问题。在鼠标悬停事件再次触发sidemenu函数之前，不会再次插入显示样式

要确保选项卡菜单功能显示第一项，必须再次设置css&类，以便添加：

document.getElementById(tabname).children[1].style.display = 'block';
document.getElementById(tabname).children[0].children[0].className += " active";

您需要更改sidetablinks的标记，以便在用户选择选项卡之前它们不再处于活动状态：

<button class="sidetablinks" onmouseover="sidemenu(event, 'st1')">Side Tab1</button>

奥特派-我们知道！表1 表2 表3 侧标签1 侧片2 侧片3 侧面选项卡11内容描述