Question

我正试图在之前的TD中通过jquery检查/取消选择一个选择框。我已经尝试了几个小时的几个组合与prev（），parent（），nearest（），但仍然没有结果...这是示例代码：

<table>
 <tr>
 <td><input type="checkbox" class="resultcheck"></td>
 <td><label class="resultchecklabel">Text 1</label></td>
 </tr>

 <tr>
 <td><input type="checkbox" class="resultcheck"></td>
 <td><label class="resultchecklabel">Text 2</label></td>
 </tr>

</table>

<script>
$('.resultchecklabel').live('click', function() {
 if ($(this).prev('td input:checked').val() != null) 
 {
  $(this).prev('td').prev("input").removeAttr("checked");
 }
 else
 {
  $(this).prev('td').prev("input").attr("checked","checked");
 }
});
</script>

谁能帮我解决这个问题？非常感谢！

Answer 1

@Adam和@peterendidit击中头部 - 这里不需要javascript / jQuery。

您的代码无效的原因可能是因为您的上下文中的this是label元素，而td是彼此的兄弟，而不是label {1}}。我认为如果你有更复杂的要求 - 比如额外的造型等等，那就可以做你想做的事情就足够了。

var cb = $(this).closest('td')  // containing TD
                .prev('td')     // previous TD
                .find('input'); // input within TD
if (cb.find(':checked').length == 0) { // not checked
    cb.attr('checked','checked');
}
else {
    cb.removeAttr('checked');
}

Answer 2

现实生活中的解决方案

与ID结合使用for：

 <td><input type="checkbox" id="resultcheck1"></td>
 <td><label for="resultcheck1">Text 2</label></td>

并拧紧javascript：]

树遍历：

你必须把它想象成一棵树。那说，考虑范围（你有什么作为$（this））：

您想要从resultchecklabel转到resultcheck，您必须前往td =＆gt;之前的td =＆gt;它的孩子{{1} }。

翻译为树关系：resultcheck =＆gt; parent =＆gt; previous sibling。现在，很容易将这个英语翻译成jQuery，因为它非常简单：

child

如你所见，当你想到树上的运动内涵时，它几乎是带括号的英语。

例如：

http://jsbin.com/evupu/2

Answer 3

标签不需要花哨的javascript连接到输入元素。只需为输入提供ID并使用标签上的for属性：

<table>
 <tr>
 <td><input type="checkbox" class="resultcheck" id="resultcheck1"></td>
 <td><label class="resultchecklabel" for="resultcheck1">Text 1</label></td>
 </tr>

 <tr>
 <td><input type="checkbox" class="resultcheck" id="resultcheck2"></td>
 <td><label class="resultchecklabel" for="resultcheck2">Text 2</label></td>
 </tr>

</table>

在TD的jquery Tree Traversal prev（）

3 个答案:

现实生活中的解决方案

树遍历：

例如：