jquery如果有类问题

jquery if has class issue

本文关键字：问题 如果 jquery      更新时间：2023-09-26

我正在使用引导选项卡，如果单击LI我想用javascript做一些功能，但有条件的，如果它处于活动状态，则什么都不做，否则就这样做...

我想出了这段代码来检查它是否has a class="active" since bootstrap tabs adds class="active" to LI for the active tab但它不能很好地工作，它总是返回 true，我在这里做错了什么？

法典

var i = $( "li" ).hasClass( "active" );
$( "li" ).click(function() {            
    if (i == true ) {
        console.log("the tab is already active");
    }   
    else {
        console.log("selected");
    }      
});

这是 JSFIDDLE 演示

对获取的当前对象使用 $(this)

$( "li" ).click(function() {
    if ($(this).hasClass("active")) {
       console.log("the tab is already active");
    }   
    else {
          console.log("selected");
    }
});

小提琴

检查 hasClass 是否点击了 li：

$( "li" ).click(function() {            
    if ($(this).hasClass('active') ) {
        console.log("the tab is already active");
    }   
    else {
        console.log("selected");
    }      
});

因为 $("li"( 返回所有 li 标签。并且第一个 li 选项卡的初始状态是活动的，因此 i 变量始终为真。

将代码更改为 Sah 编写的代码@Bhojendra即可使用。

您也可以对动态元素尝试此操作：

$(document).on('click', "li.active", function (e) {
    console.log("the tab is already active");
}).on('click', "li:not(.active)", function (e) {
    console.log("selected");
});

例

$( "li" ).click(function() {            
    if ($(this).hasClass("active") ) {
        console.log("the tab is already active");
    }   
    else {
        console.log("selected");
    }      
});
相关文章：