Risposte:
Per ottenere il valore dell'attributo Value puoi fare qualcosa del genere:
$("input[type='checkbox']").val();
Oppure se hai impostato un class
o id
per esso, puoi:
$('#check_id').val();
$('.check_class').val();
Tuttavia, questo restituirà lo stesso valore, indipendentemente dal fatto che sia selezionato o meno, ciò può creare confusione in quanto diverso dal comportamento del modulo inviato.
Per verificare se è selezionato o meno, procedere come segue:
if ($('#check_id').is(":checked"))
{
// it is checked
}
$($0).val()
in Chrome e deseleziono la casella di controllo, la risposta è "attiva" anche se non è selezionata. Ma $($0).is(":checked")
restituisce il giusto valore.
[type="checkbox"]
ha prestazioni migliori nei browser moderni rispetto a :checkbox
.
$('#check_id').val();
per $('#check_id').is(":checked");
restituire il valore vero o falso.
Quei 2 modi funzionano:
$('#checkbox').prop('checked')
$('#checkbox').is(':checked')
(grazie @mgsloan)$('#test').click(function() {
alert("Checkbox state (method 1) = " + $('#test').prop('checked'));
alert("Checkbox state (method 2) = " + $('#test').is(':checked'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Check me: <input id="test" type="checkbox" />
Prova questa piccola soluzione:
$("#some_id").attr("checked") ? 1 : 0;
o
$("#some_id").attr("checked") || 0;
L'unico modo corretto per recuperare il valore di una casella è il seguente
if ( elem.checked )
if ( $( elem ).prop( "checked" ) )
if ( $( elem ).is( ":checked" ) )
come spiegato nelle documentazioni ufficiali nel sito Web di jQuery. Il resto dei metodi non ha nulla a che fare con la proprietà della casella di controllo, stanno controllando l'attributo, il che significa che stanno testando lo stato iniziale della casella di controllo quando è stata caricata. Quindi in breve:
elem.checked
) o puoi usare $(elem).prop("checked")
se vuoi fare affidamento su jQuery.$(elem).is(":checked")
.Le risposte sono fuorvianti, controlla sotto di te:
.is(":checked")
e .prop(":checked")
stanno lavorando allo stesso modo per me con jQuery 1.10.0
$('#checkbox_id').val();
$('#checkbox_id').is(":checked");
$('#checkbox_id:checked').val();
jQuery(".checkboxClass").click(function(){
var selectedCountry = new Array();
var n = jQuery(".checkboxClass:checked").length;
if (n > 0){
jQuery(".checkboxClass:checked").each(function(){
selectedCountry.push($(this).val());
});
}
alert(selectedCountry);
});
Semplice ma efficace e presuppone che tu sappia che la casella di controllo sarà trovata:
$("#some_id")[0].checked;
Dà true
/false
//By each()
var testval = [];
$('.hobbies_class:checked').each(function() {
testval.push($(this).val());
});
//by map()
var testval = $('input:checkbox:checked.hobbies_class').map(function(){
return this.value; }).get().join(",");
//HTML Code
<input type="checkbox" value="cricket" name="hobbies[]" class="hobbies_class">Cricket
<input type="checkbox" value="hockey" name="hobbies[]" class="hobbies_class">Hockey
Demo di esempio
Nonostante il fatto che questa domanda richieda una soluzione jQuery, ecco una pura risposta JavaScript poiché nessuno l'ha menzionata.
Basta selezionare l'elemento e accedere alla checked
proprietà (che restituisce un valore booleano).
var checkbox = document.querySelector('input[type="checkbox"]');
alert(checkbox.checked);
<input type="checkbox"/>
Ecco un breve esempio ascoltando l' change
evento:
var checkbox = document.querySelector('input[type="checkbox"]');
checkbox.addEventListener('change', function (e) {
alert(this.checked);
});
<input type="checkbox"/>
Per selezionare gli elementi selezionati, utilizzare la :checked
pseudo classe ( input[type="checkbox"]:checked
).
Ecco un esempio che ripete verificato input
elementi e restituisce un array mappato dei nomi degli elementi selezionati.
var elements = document.querySelectorAll('input[type="checkbox"]:checked');
var checkedElements = Array.prototype.map.call(elements, function (el, i) {
return el.name;
});
console.log(checkedElements);
checked
proprietà è facilmente accessibile sull'elemento DOM nativo. Alcune persone che cercano domande / risposte come queste generalmente non sono consapevoli del fatto che jQuery a volte non è necessario. In altre parole, le persone dalla mentalità ristretta non sono il target demografico per questa risposta.
Ecco come ottenere il valore di tutte le caselle di controllo selezionate come un array:
var values = (function() {
var a = [];
$(".checkboxes:checked").each(function() {
a.push(this.value);
});
return a;
})()
per ottenere il valore di checkboxex controllato in jquery
:
var checks = $("input[type='checkbox']:checked"); // returns object of checkeds.
for(var i=0; i<checks.length; i++){
console.log($(checks[i]).val()); // or do what you want
});
in pure js
:
var checks = document.querySelectorAll("input[type='checkbox']:checked");
for(var i=0; i<checks.length; i++){
console.log(checks[i].value); // or do what you want
});
Usa il seguente codice:
$('input[name^=CheckBoxInput]').val();
$('.class[value=3]').prop('checked', true);
Il modo migliore è $('input[name="line"]:checked').val()
E puoi anche ottenere il testo selezionato $('input[name="line"]:checked').text()
Aggiungi l'attributo valore e il nome agli input dei pulsanti di opzione. Assicurarsi che tutti gli input abbiano lo stesso attributo nome.
<div class="col-8 m-radio-inline">
<label class="m-radio m-radio-filter">
<input type="radio" name="line" value="1" checked> Value Text 1
</label>
<label class="m-radio m-radio-filter">
<input type="radio" name="line" value="2"> Value Text 2
</label>
<label class="m-radio m-radio-filter">
<input type="radio" name="line" value="3"> Value Text 3
</label>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.laravel').click(function(){
var val = $(this).is(":checked");
$('#category').submit();
});
});
<form action="{{route('directory')}}" method="post" id="category">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<input name="category" value="{{$name->id}}" class="laravel" type="checkbox">{{$name->name}}
</form>
Solo attenzione, ad oggi, 2018, a causa del cambiamento di api nel corso degli anni. removeAttr è deprecato, NON funziona più!
Jquery Seleziona o deseleziona una casella di controllo:
Cattivo, non funziona più.
$('#add_user_certificate_checkbox').removeAttr("checked");
$('#add_user_certificate_checkbox').attr("checked","checked");
Invece dovresti fare:
$('#add_user_certificate_checkbox').prop('checked', true);
$('#add_user_certificate_checkbox').prop('checked', false);
$("input:checkbox")
. Inoltre, sembra che ci sia un refuso nel selettore di classe ...