Html 单击说明时选中复选框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4696198/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Check checkbox when clicking on description
提问by Mike Wills
I will be creating a list of check boxes that will be built by jQuery and JSON. The list will be a selection of groups that a message can be sent to. It could be one of more groups. This part I can figure out. The problem I am having is how do I enable the description so that when I click on the description, the checkbox is selected.
我将创建一个由 jQuery 和 JSON 构建的复选框列表。该列表将是消息可以发送到的一组选择。它可能是更多组之一。这部分我可以弄清楚。我遇到的问题是如何启用描述，以便在单击描述时选中复选框。
<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>
回答by Chandu
Use a Label with forattribute (I assigned different IDs for checkboxes) :
使用带有for属性的标签（我为复选框分配了不同的 ID）：
<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>
回答by Janaka R Rajapaksha
A different solution (without using the "for" attribute) is including each <input />field inside of <label></label>tags.
一个不同的解决方案（不使用“for”属性）是<input />在<label></label>标签内包含每个字段。
Example:
例子：
<label><input type="checkbox" value="" /> Click Here to Check This</label>
This could a solution if you have to display the checkboxes with labels as inline-block.
如果您必须将带有标签的复选框显示为inline-block.
回答by Alec
First: you have a duplicate idin there. An idshould be unique.
第一：你id在那里有一个副本。Anid应该是唯一的。
The easiest way is to use the labeltag, e.g.:
最简单的方法是使用标签标签，例如：
<input type="checkbox" name="group" id="group_1" />
<label for="group_1">description</label>Now you can click on the text and it'll toggle the checkbox. An alternative is to use jQuery's clickfunction: http://www.google.com/#q=jquery+check+checkbox+on+click.
现在您可以单击文本，它会切换复选框。另一种方法是使用 jQuery 的click函数：http://www.google.com/#q=jquery+check+checkbox+on+click。
回答by Greg
Also you could use jQuery if you don't want to user a 'label'
如果您不想使用“标签”，也可以使用 jQuery
<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>
回答by Shijo Rs
<label style="cursor:pointer" for="clickme">clickme</label><br>
<span><input id="clickme" type="checkbox"/>anand</span> 