如果點擊選中的項目防止取消選中

Question

我想要的是，當列表項被選中時，你點擊選中的項目，你不能取消選中它們。

感謝所有幫助:)

$(".collectioncontainer ul li").click(function(){ 
    $('.collectioncontainer ul li.checked').not(this).removeClass('checked'); 
    $(this).toggleClass('checked'); 
}) 

Answer 1

有在使用.hasClass()檢查類的點擊元件上的存在沒有任何意義。使用.addClass()因爲你只需要添加類：

$(".collectioncontainer ul li").click(function(){ 
    $('.collectioncontainer ul li.checked').not(this).removeClass('checked'); 
    $(this).addClass('checked'); 
}); 

Answer 2

您可以通過使用hasClass方法不是檢查嘗試：

$(".collectioncontainer ul li").click(function(){ 
    if(!$(this).hasClass('checked')) { 
     $(this).addClass('checked'); 
    } 
}); 

Answer 3

只需在不刪除類。

$(document).ready(function() { 
 
    $('li').click(function() { 
 
    $(this).addClass('checked'); 
 
    }); 
 
});

li.checked { 
 
    background-color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li>a</li> 
 
    <li>a</li> 
 
    <li>a</li> 
 
    <li>a</li> 
 
</ul>

Answer 4

如果你只需要事件處理程序做一些單時，one方法是有用的：

$(".collectioncontainer ul li").one('click', function() { 
    $(this).addClass('checked'); 
}) 

使用addClass使得它明確你只想要一個課程被包含在這個動作中，並且可以防止意外地使用toggleClass刪除課程。

Answer 5

如果你只希望你的複選框要檢查的第一時間，並保持它們被選中，使用事件偵聽器：

<input id="checkbox" type="checkbox" name="bob" value="I'm bob"> 

<script type="text/javascript"> 
    var c=document.getElementById("checkbox"); 
    c.addEventListener("click",function(event_){ 
     this.checked=true; 
    }); 
</script> 

我知道你正在使用JQuery，但我敢肯定，你可以很容易看到普通的JavaScript做了什麼，這個概念應該是真實的。我對JQuery並不是很瞭解，但我認爲你使用的是一個點擊事件監聽器。希望這可以幫助！