Come disattivare la casella di controllo con jquery?

Question

Ho cercato più tempo con esso ma non funziona, desidero che la casella di controllo sia disabilitata, che l'utente non controlli e che possa controllarlo in determinate condizioni. Ok, ora ho provato a disabilitarli. Io uso jQuery 2.1.3

<input type="checkbox" class="checkbox1" id="chk" name="check[]" value="U01" />Banana 
 
<input type="checkbox" class="checkbox1" id="chk" name="check[]" value="U02" />Orange 
 
<input type="checkbox" class="checkbox1" id="chk" name="check[]" value="U03" />Apple 
 
<input type="checkbox" class="checkbox1" id="chk" name="check[]" value="U04" />Candy

$(window).load(function() { 
    $('#chk').prop('disabled', true); 
}); 

Answer 1

id deve essere univoco. Non puoi avere quattro checkbox con lo stesso id.

È possibile provare altri selettori per selezionare l'intero intervallo di caselle di controllo, ad esempio .checkbox1 (per classe), input[type="checkbox"] (per tag/attributo). Una volta che hai corretto gli ID, potresti provare anche a #chk1, #chk2, #chk3, #chk4.

Lo snippet in basso utilizza il nome di classe 'chk' invece dell'id 'chk'. Inoltre, usa attr per impostare l'attributo, sebbene abbia funzionato anche con me usando prop.

$(window).load(function() { 
 
    $('.chk').attr('disabled', true); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" class="chk" name="check[]" value="U01" />Banana 
 
<input type="checkbox" class="chk" name="check[]" value="U02" />Orange 
 
<input type="checkbox" class="chk" name="check[]" value="U03" />Apple 
 
<input type="checkbox" class="chk" name="check[]" value="U04" />Candy

Answer 2

È già cambiato l'ID, ma si può anche mettere la classe nello stesso attributo come ad esempio:

<input type="checkbox" class="checkbox1 chk" name="check[]" value="U01" />Banana 

quindi è possibile utilizzare jQuery per disattivare o controllare un casella di controllo a seconda delle esigenze,

Per disabilitare:

$(function() { 
    $('.chk').prop('disabled', true); 
}); 

Per "controllo preliminare":

$(function() { 
    $('.chk').prop('checked', true); 
}); 

È possibile cambiare il selettore per adattare gli ID o classi anche elementi e modificare le proprietà tra vere o false in base alle proprie esigenze.

Answer 3

HTML:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<input type="checkbox" class="checkbox1" class="chk" name="check[]" value="U01" />Banana 
<input type="checkbox" class="checkbox1" class="chk" name="check[]" value="U02" />Orange 
<input type="checkbox" class="checkbox1" class="chk" name="check[]" value="U03" />Apple 
<input type="checkbox" class="checkbox1" class="chk" name="check[]" value="U04" />Candy 

JavaScript/jQuery

$(function() { 
    $("input.checkbox1").prop("disabled", true); 
});