如何點擊和「取消點擊」一個元素

Question

好吧，我是一個真正的初學者，當談到jQuery時，雖然我已經試過尋找這個，但我似乎無法找到答案（我是可能不會正確表達它）。

當點擊其中一個li時，我想添加一個元素。但是，如果li已經被點擊（並且該類已經添加），如果用戶再次點擊，我想刪除該類。到目前爲止，這是我有：

(function($){ 
    $(".list li").click(function() { 
     $(this).addClass("hilite"); 
     $(this).attr("BeenClicked", "true"); 
    }); 
})(jQuery); 

<ul class="list"> 
    <li> Something 
    <li> Something else 
</ul> 

我需要創建代碼，實質上檢查該屬性，看看「BeenClicked」設置爲true。

Answer 1

你將不得不使用jQuery的toggleClass：

(function($){ 
    $(".list li").click(function() { 
     $(this).toggleClass("hilite"); 
    }); 
})(jQuery); 

Answer 2

使用.toggleClass()自動交替每次點擊類：

(function($){ 
    $(".list li").click(function() { 
     $(this).toggleClass("hilite"); 
    }); 
})(jQuery); 

<ul class="list"> 
    <li> Something 
    <li> Something else 
</ul> 

有沒有必要單獨存儲"BeenClicked"屬性。您可以隨時用.hasClass("hilite")方法查看它是否有班級。另外，如果您打算在其上存儲數據，那麼jQuery方式將使用.data()方法：$(this).data("BeenClicked", true);。

Answer 3

您可能想查看jQuery的toggleClass()方法。

http://api.jquery.com/toggleClass/

只是把它在你的點擊處理程序。