jquery如果有類問題

Question

我正在使用bootstrap選項卡，我想用javascript做一些函數如果LI被點擊但有條件，如果它是活動什么都不做，否則這樣做...

我已經提出了這個代碼來檢查它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演示

Answer 1

使用$(this)獲取當前對象

$( "li" ).click(function() {

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

});

小提琴

Answer 2

檢查hasClass是否已點擊li：

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

Answer 3

因為$（“li”）返回所有li標簽。 並且第一個li選項卡的初始狀態是活動的，因此i變量始終為true。

將代碼更改為@Bhojendra Sah所寫的內容。

Answer 4

您也可以嘗試使用動態元素：

$(document).on('click', "li.active", function (e) {

    console.log("the tab is already active");

}).on('click', "li:not(.active)", function (e) {

    console.log("selected");

});

例

Answer 5

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