Kiểm tra hộp kiểm khi nhấp vào mô tả

Question

Tôi sẽ tạo danh sách các hộp kiểm sẽ được xây dựng bởi jQuery và JSON. Danh sách sẽ là một nhóm các nhóm có thể gửi tin nhắn đến. Nó có thể là một trong nhiều nhóm. Phần này tôi có thể tìm ra. Vấn đề tôi gặp phải là làm cách nào để kích hoạt mô tả để khi tôi nhấp vào mô tả, hộp kiểm được chọn.

<div> 
    <label for="group"> 
     Select lists 
    </label> 
</div> 
<div> 
    <input type="checkbox" name="group" id="group" value="1" title="Main List" />Main List 
    <input type="checkbox" name="group" id="group" value="2" title="Secondary List" />Secondary List 
</div> 

Answer 1

Sử dụng một Label với for thuộc tính (tôi giao ID khác nhau cho các hộp kiểm):

<div> 
    <label for="group"> 
     Select lists 
    </label> 
</div> 
<div> 
    <input type="checkbox" name="group" id="group1" value="1" title="Main List" /> 
    <label for="group1">Main List</label> 
    <input type="checkbox" name="group" id="group2" value="2" title="Secondary List" /> 
    <label for="group2">Secondary List</label> 
</div> 

Answer 2

Đầu tiên: bạn có bản sao id trong đó. An id phải là duy nhất.

Cách đơn giản nhất là sử dụng thẻ label, ví dụ .:

<input type="checkbox" name="group" id="group_1" /> 
<label for="group_1">description</label>

Bây giờ bạn có thể nhấp vào văn bản và nó sẽ chuyển vào hộp kiểm. Một cách khác là sử dụng chức năng click của jQuery: http://www.google.com/#q=jquery+check+checkbox+on+click.

Answer 3

Ngoài ra bạn có thể sử dụng jQuery nếu bạn không muốn sử dụng một 'nhãn'

<input type="checkbox" name="SelectionCheckbox" id="SelectionCheckbox" /> 
<div onclick="$('input[id $=SelectionCheckbox]').attr('checked', this.checked);"> 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit 
    </div> 

Answer 4

Một giải pháp khác (không sử dụng thuộc tính "cho") bao gồm mỗi trường <input /> bên trong các thẻ <label></label>.

Ví dụ:

<label><input type="checkbox" value="" /> Click Here to Check This</label> 

Đây có thể là một giải pháp nếu bạn có để hiển thị các hộp kiểm có nhãn như inline-block.