如何在单击表格行时选中/取消选中复选框

时间:2013-05-10 09:32:12

标签: javascript jquery html

我需要选中/取消选中表格主体下一行内的复选框,只要在一行内的任何位置点击该链接即可。我试图通过使用jQuery的prop来使它工作,但有些东西不能正常工作。

我有一个如下表结构:

<table id="anywhere_click">
<thead>
    <tr>
        <th><input type="checkbox" onclick="selectAll('myDataID[]');" /></th>
        <th>Title</th>
        <th>Details</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td><input type="checkbox" name="myDataID[]" value="1" /></td>
        <td>Stackoverflow</td>
        <td>Some text here....</td>
    </tr>
    <tr>
        <td><input type="checkbox" name="myDataID[]" value="2" /></td>
        <td>Google</td>
        <td>
            <a href="aaa.html">This is a Link</a><br />
            Some text here....<br />
            <img src="something.jpg" />
        </td>
    </tr>
    <tr>
        <td><input type="checkbox" name="myDataID[]" value="3" /></td>
        <td>test</td>
        <td>Some text here....</td>
    </tr>
</tbody>
</table>

2 个答案:

答案 0 :(得分:6)

$('#anywhere_click tbody tr').click(function (e) {
    if(!$(e.target).is('#anywhere_click td input:checkbox'))
    $(this).find('input:checkbox').trigger('click');
});

$('#anywhere_click tr a').click(function (e) {
    e.stopPropagation();
});

答案 1 :(得分:0)

如果您检查了网站的加载时间。

您必须添加标记<td><input type="checkbox" name="myDataID[]" value="3" /></td> 检查。

<td><input type="checkbox" name="myDataID[]" value="3" checked /></td>

使用您想要选中和取消选中的按钮。

信息:Information

和示例:Examble with button checked and unchecked