a

Câu hỏi Kiểm tra nếu hộp kiểm được kiểm tra với jQuery


Làm cách nào để kiểm tra xem hộp kiểm trong mảng hộp kiểm có được chọn bằng id của mảng hộp kiểm không?

Tôi đang sử dụng mã sau đây, nhưng nó luôn trả về số lượng hộp kiểm được chọn bất kể id.

function isCheckedById(id) {
  alert(id);
  var checked = $("input[@id=" + id + "]:checked").length;
  alert(checked);

  if (checked == 0) {
    return false;
  } else {
    return true;
  }
}

947
2018-02-05 00:23


gốc


A mảng hộp kiểm? Chưa bao giờ nghe nói về một điều như vậy. Đó có phải là một cái gì đó JQuery cụ thể, hoặc một plugin / widget? - Pekka 웃
một ô trống có nghĩa là: <input type = "checkbox" name = "chk []" id = "chk []" giá trị = "apple"> <input type = "checkbox" name = "chk []" id = "chk []" value = "banana"> <input type = "checkbox" name = "chk []" id = "chk []" giá trị = "cam"> v.v. - Jake
có gì sai với một mảng hộp kiểm? bạn sẽ làm cách nào khác để nhập "kiểm tra tất cả áp dụng"? - nickf
Hãy chắc chắn rằng bạn id s là duy nhất! name có thể (và nên, trong trường hợp này) lặp lại, nhưng bạn sẽ tìm thấy rất nhiều điều kỳ lạ xảy ra nếu bạn lặp lại id! = D - Jeff Rupert
Tôi phải xóa "@" để nó hoạt động. Ngoài ra, bạn có thể rút ngắn 5 dòng cuối cùng thành 1: return (checked! = 0); - B. Clay Shannon


Các câu trả lời:


ID phải là duy nhất trong tài liệu của bạn, có nghĩa là bạn không nên làm cái này:

<input type="checkbox" name="chk[]" id="chk[]" value="Apples" />
<input type="checkbox" name="chk[]" id="chk[]" value="Bananas" />

Thay vào đó, hãy xóa ID và sau đó chọn chúng theo tên hoặc bằng phần tử chứa:

<fieldset id="checkArray">
    <input type="checkbox" name="chk[]" value="Apples" />

    <input type="checkbox" name="chk[]" value="Bananas" />
</fieldset>

Và bây giờ jQuery:

var atLeastOneIsChecked = $('#checkArray:checkbox:checked').length > 0;
//there should be no space between identifier and selector

// or, without the container:

var atLeastOneIsChecked = $('input[name="chk[]"]:checked').length > 0;

576
2018-02-05 00:31



Đối với tôi làm việc mà không có dấu ngoặc kép đôi vào tên đầu vào: đầu vào [name = multiplecheck []]: checked, thanks! - Alejandro Quiroz
Tại sao sử dụng $('#checkArray :checkbox:checked').length > 0; khi đơn giản hơn $('#checkArray').checked hoạt động và có sẵn trên nhiều phiên bản hơn? - mmcrae
.checked không hoạt động. - Oddman
@Oddman nó hoạt động, không phải trên một đối tượng jquery. thay vì $ (elem) .checked, hãy thử elem.checked. - Dan Williams
@DanWilliams có nhưng không phải trong ví dụ mmcrae đã cho. - Oddman


$('#' + id).is(":checked")

Điều đó sẽ xảy ra nếu hộp kiểm được chọn.

Đối với một loạt các hộp kiểm có cùng tên, bạn có thể nhận danh sách các hộp kiểm đã chọn bằng cách:

var $boxes = $('input[name=thename]:checked');

Sau đó, để lặp qua chúng và xem những gì được kiểm tra, bạn có thể làm:

$boxes.each(function(){
    // Do stuff here with this
});

Để tìm số lượng bạn đã chọn, bạn có thể thực hiện:

$boxes.length;

1696
2018-02-05 00:24



hmm .. Làm thế nào để biết có bao nhiêu được kiểm tra trong mảng hộp kiểm đó? - Jake
chỉ cần chỉnh sửa nó để tìm số được chọn. - John Boker
Một cách khác là $('#'+id).attr('checked'), tương đương với $('#' + id).is(":checked") nhưng dễ nhớ hơn IMO. - Zubin
@ Zubin: Hãy cẩn thận với .attr('checked'). Hành vi của nó thay đổi trong jQuery 1.6. Nó được sử dụng để trở lại false hoặc là true. Bây giờ nó trả về undefined hoặc là "checked". .is(':checked') không có vấn đề này. - Joey Adams
Lưu ý: size () đã không còn được dùng kể từ jQuery 1.8 - sử dụng .length thay thế - JM4


$('#checkbox').is(':checked'); 

Mã trên trả về true nếu hộp kiểm được chọn hoặc false nếu không.


240
2018-05-31 09:37



rất hữu ích khi sử dụng $ (this) .is (': checked'); Cảm ơn! - PinoyStackOverflower
Có, giải pháp duy nhất hoạt động với $ (this)! - Tillito
Điều này đã làm việc! Cảm ơn - Raru
Bằng cách này là hữu ích để kiểm tra nếu hộp kiểm được kiểm tra, nơi bạn biết làm thế nào để chọn nó, cảm ơn bạn - Omar Isaid


Tất cả các phương pháp sau đều hữu ích:

$('#checkbox').is(":checked")

$('#checkbox').prop('checked')

$('#checkbox')[0].checked

$('#checkbox').get(0).checked

Bạn nên tránh DOMelement hoặc inline "this.checked" thay vì jQuery trên phương thức nên được sử dụng event listener.


79
2017-07-13 16:25





Khái niệm quan trọng nhất cần nhớ về thuộc tính đã chọn là   rằng nó không tương ứng với thuộc tính đã kiểm tra. Thuộc tính   thực sự tương ứng với thuộc tính defaultChecked và nên được sử dụng   chỉ để đặt giá trị ban đầu của hộp kiểm. Thuộc tính đã chọn   giá trị không thay đổi với trạng thái của hộp kiểm, trong khi   đã kiểm tra thuộc tính. Do đó, cách tương thích giữa các trình duyệt với   xác định xem hộp kiểm có được chọn hay không là sử dụng thuộc tính

Tất cả các phương pháp dưới đây là có thể

elem.checked 

$(elem).prop("checked") 

$(elem).is(":checked") 

57
2017-07-09 06:40





Mã jQuery để kiểm tra xem hộp kiểm có được chọn hay không:

if($('input[name="checkBoxName"]').is(':checked'))
{
  // checked
}else
{
 // unchecked
}

Ngoài ra:

if($('input[name="checkBoxName"]:checked'))
{
    // checked
}else{
  // unchecked
}

57
2017-10-04 10:06



Thiếu giải pháp đầu tiên :... Đúng là: if(('input[name="checkBoxName"]').is(':checked')). - Aerendir


Bạn có thể sử dụng mã này,

if($("#checkboxId").is(':checked')){
     // Code in the case checkbox is checked.
} else {
     // Code in the case checkbox is NOT checked.
}

32
2017-10-07 14:26