2009-12-24 20 views
20

làm cách nào tôi có thể tính toán số lượng hộp kiểm mà người dùng đã kiểm tra bằng jquery?tính số hộp kiểm tra html bằng cách sử dụng jquery

điều tôi muốn làm là giới hạn số lần kiểm tra hộp kiểm trong biểu mẫu thành 10 ví dụ và khi người dùng vượt quá phạm vi này hiển thị thông báo cảnh báo.

+0

có thể trùng lặp của [Cách nhận tổng số hộp kiểm được chọn trên một trang] (http: // stackove rflow.com/questions/872296/how-to-get-a-count-of-all-checked-checkboxes-on-a-page) – gcochard

Trả lời

60

Có nhiều phương pháp để làm điều đó:

Phương pháp 1:

alert($('.checkbox_class_here:checked').size()); 

Cách 2:

alert($('input[name=checkbox_name]').attr('checked')); 

Phương pháp: 3

alert($(":checkbox:checked").length); 
+1

Câu trả lời hay, nhưng bạn không nên sử dụng .checkbox_id_here thay vì # checkbox_id_here? Nếu bạn sử dụng #checkbox_id_here, size() sẽ luôn là 1, sẽ là vô nghĩa vì chỉ có thể có một ID duy nhất. Làm cho tinh thần để tham khảo các lớp học thay vào đó, nơi có thể có nhiều hộp kiểm –

+0

@Bug Magnet: Cảm ơn bạn đã chỉ ra lỗi đánh máy, cố định :) – Sarfraz

+1

'alert ($ ('. Pairing-cbk: checked'). Size()); 'không hoạt động nhưng' alert ($ ('. pairing-cbk: checked'). size()); 'làm việc vì lý do được đề cập ở trên bởi @James Wiseman – Amitabh

17

này nên làm việc:

alert($("input:checkbox:checked").length); 
+0

$ ("đầu vào: hộp kiểm: đã chọn"). với khoảng trống giữa hộp kiểm và: đã chọn sẽ không hoạt động với hộp kiểm. –

+1

Đó là bởi vì nó sẽ tìm kiếm hậu duệ của 'đầu vào: hộp kiểm' đã được 'kiểm tra', không phải cho' đầu vào: hộp kiểm' được tự kiểm tra. Không gian quy định một mối quan hệ tổ tiên/hậu duệ. –

+0

Cảm ơn đầu vào Tôi thực sự không biết điều đó. –

2

Nếu không ai trong số các phương pháp trên hiệu quả, bạn có thể đã không được nhập jQuery được nêu ra. Để nhập jQuery, hãy dán mã này vào mã số <head> của HTML của bạn.

<script src="//code.jquery.com/jquery-1.10.2.js"></script> 

Tôi thực sự gặp vấn đề tương tự khi tạo trang đặt hàng sản phẩm và tôi muốn đếm Số lượng sản phẩm trong giỏ hàng tại trang xác nhận đơn đặt hàng. Tôi đã đề cập đến bài đăng này và đã thử tất cả các phương pháp. Sau đó, tôi phát hiện ra tôi đã không nhập jQuery, do đó, $(':checkbox:checked') không hoạt động.

0

bạn nên sử dụng

alert($("input:checkbox:checked").length); 

hoặc

alert($(".checkbox-class:checked").length); 

nếu bạn có các hình thức hơn trên một trang

.size() (phương pháp số 1 trong câu trả lời được chấp nhận hiện nay) bị phản đối kể từ jQuery 1.8

Các vấn đề liên quan