如何检查按钮是否有活动类?[关闭]

How to check if the button has an active class? [closed]

提问人:oooo 提问时间:11/17/2023 最后编辑:oooo 更新时间:11/17/2023 访问量:69

问:


想改进这个问题吗?通过编辑这篇文章添加详细信息并澄清问题。

3天前关闭。

这篇文章在3天前被编辑并提交审核,未能重新打开帖子:

原始关闭原因未解决

我有一个处于活动状态的按钮,想知道检查它是否处于活动状态的语法。

 <ul class="nav nav-tabs" id="myTab" role="tablist">
    <li class="nav-item" role="presentation">
      <button class="nav-link active" id="personnelBtn" data-bs-toggle="tab" data-bs-target="#personnel-tab-pane" type="button" role="tab" aria-controls="home-tab-pane" aria-selected="true">
        <i class="fa-solid fa-person fa-lg fa-fw"></i><span class="d-none d-sm-block">Personnel</span>
      </button>
    </li>
JavaScript 的HTML

评论

1赞 DarkBee 11/17/2023
这里的“活跃”是什么意思?
0赞 T.J. Crowder 11/17/2023
恐怕不清楚你在这里问什么。“活动活动选项卡”怎么会不处于活动状态?您何时/何地试图确定选项卡是否处于活动状态?渲染时?在点击处理程序中?我不禁注意到上面有一个类,也许看看选项卡的按钮是否有那个类?buttonactive
0赞 oooo 11/17/2023
如何检查按钮是否有活动类?

答:

0赞 Amit Mohanty 11/17/2023 #1

要检查带有 ID 的选项卡是否处于活动状态,您可以使用 JavaScript:personnelBtn

const personnelTab = document.querySelector('#personnelBtn');

if (personnelTab.classList.contains('active')) {
  console.log('The tab is currently active');
} else {
  console.log('The tab is not active');
}

评论

0赞 DarkBee 11/17/2023
如果 OP 有多个选项卡怎么办?我无法想象只有一个选项卡时会处于活动状态
0赞 Amit Mohanty 11/17/2023
如果有多个选项卡并检查是否有任何选项卡处于活动状态,则可以循环遍历所有选项卡元素
3赞 DarkBee 11/17/2023
虽然没有 id 选择器
0赞 oooo 11/17/2023
它不起作用,会产生错误。Uncaught TypeError: Cannot read property 'backdrop' of undefined at On._initializeBackDrop (modal.js:158) at new On (modal.js:69) at Function.getOrCreateInstance (base-component.js:65) at HTMLButtonElement.<anonymous> (modal.js:363) at HTMLDocument.n (event-handler.js:118)
0赞 oooo 11/17/2023
我自己想通了。
-2赞 Kadir Akbulut 11/17/2023 #2

您可以选择以下选项

$('.nav-link.active')

评论

0赞 tacoshy 11/17/2023
它错过了更多的细节和澄清,因为这不仅仅是 JavaScript,而是 jQuery,OP 需要有依赖项。此外,这只是选择一些东西,它不会检查元素是否具有类。