提问人:oooo 提问时间:11/17/2023 最后编辑:oooo 更新时间:11/17/2023 访问量:69
如何检查按钮是否有活动类?[关闭]
How to check if the button has an active class? [closed]
问:
我有一个处于活动状态的按钮,想知道检查它是否处于活动状态的语法。
<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>
答:
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 需要有依赖项。此外,这只是选择一些东西,它不会检查元素是否具有类。
评论
button
active