Відповіді:
Щоб отримати значення атрибута Value, ви можете зробити щось подібне:
$("input[type='checkbox']").val();
Або якщо ви встановили class
або id
для нього, ви можете:
$('#check_id').val();
$('.check_class').val();
Однак це поверне те саме значення, перевірено чи ні, це може бути заплутаним, оскільки воно відрізняється від поданої форми поведінки.
Щоб перевірити, перевірено чи ні, виконайте:
if ($('#check_id').is(":checked"))
{
// it is checked
}
$($0).val()
в Chrome і зніміть прапорець, відповідь "увімкнено", навіть якщо це не поставлено. Але $($0).is(":checked")
повертає потрібне значення.
[type="checkbox"]
має кращі показники роботи в сучасних браузерах, ніж :checkbox
.
$('#check_id').val();
щоб $('#check_id').is(":checked");
повернути значення true або false.
Ці два способи працюють:
$('#checkbox').prop('checked')
$('#checkbox').is(':checked')
(спасибі @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" />
Спробуйте це невелике рішення:
$("#some_id").attr("checked") ? 1 : 0;
або
$("#some_id").attr("checked") || 0;
Єдиний правильний спосіб отримання значення прапорця полягає в наступному
if ( elem.checked )
if ( $( elem ).prop( "checked" ) )
if ( $( elem ).is( ":checked" ) )
як пояснено в офіційних документаціях на веб-сайті jQuery. Решта методів не мають нічого спільного з властивістю прапорця, вони перевіряють атрибут, а значить, вони перевіряють початковий стан прапорця під час його завантаження. Отже коротко:
elem.checked
) або ви можете використовувати$(elem).prop("checked")
якщо хочете покластися на jQuery.$(elem).is(":checked")
.Відповіді оманливі. Будь ласка, перевірте нижче:
.is(":checked")
і .prop(":checked")
працюють однаково для мене w / 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);
});
//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
Приклад
демонстрації
Незважаючи на те, що це запитання вимагає рішення jQuery, тут є чисто відповідь JavaScript, оскільки ніхто не згадував про це.
Просто виберіть елемент та перейдіть до checked
властивості (яка повертає булева).
var checkbox = document.querySelector('input[type="checkbox"]');
alert(checkbox.checked);
<input type="checkbox"/>
Ось короткий приклад прослуховування change
події:
var checkbox = document.querySelector('input[type="checkbox"]');
checkbox.addEventListener('change', function (e) {
alert(this.checked);
});
<input type="checkbox"/>
Для вибору перевірених елементів використовуйте :checked
псевдоклас (input[type="checkbox"]:checked
).
Ось приклад, який повторює перевірені input
елементи та повертає відображений масив імен перевірених елементів.
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
властивість легко доступна на вбудованому елементі DOM. Деякі з людей, які шукають такі запитання / відповіді, як правило, не знають про те, що jQuery часом не потрібен. Іншими словами, вузькодумці не є цільовим демографічним показником для цієї відповіді.
Ось як отримати значення всіх відзначених прапорців як масиву:
var values = (function() {
var a = [];
$(".checkboxes:checked").each(function() {
a.push(this.value);
});
return a;
})()
щоб отримати значення відміченого checkboxex в 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
});
в 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
});
Використовуйте наступний код:
$('input[name^=CheckBoxInput]').val();
$('.class[value=3]').prop('checked', true);
Найкращий спосіб $('input[name="line"]:checked').val()
А також ви можете отримати вибраний текст $('input[name="line"]:checked').text()
Додайте атрибут значення та ім'я до входів радіо кнопок. Переконайтеся, що всі входи мають однаковий атрибут імені.
<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>
Лише увага, станом на сьогодні, 2018 рік, через падіння, що змінюється роками. deleteAttr вилучені, НЕ працюють більше!
Jquery Перевірте або зніміть прапорець у полі:
Погано, більше не працює.
$('#add_user_certificate_checkbox').removeAttr("checked");
$('#add_user_certificate_checkbox').attr("checked","checked");
Натомість слід зробити:
$('#add_user_certificate_checkbox').prop('checked', true);
$('#add_user_certificate_checkbox').prop('checked', false);
$("input:checkbox")
. Крім того, здається, помилка друку у селекторі класу ...