Jquery 如果最近的td.classname中有复选框，则选中它

我有一张预约表，上面有单选按钮，列出了预约课程的课程。如果类已满，则该行上会显示一个等待列表复选框，并显示该类的单选按钮。在jQuery中，如果单击完整类单选按钮，我希望jQuery选中等待列表复选框。td class=wailist将出现在每一行中，但只有当类已满时，复选框才会出现在HTML中。 到目前为止，我的jQuery-

var $class_table = JQuery('table.courses');
$class_table.find('input.radio').click(function (event)
{
   //if this row has a td.waitlist with a checkbox in it then check that box
 });

以下是HTML代码片段：

<tr class="course_full">
<td class="course_select", colspan=2>
    <label>
        <input type="radio" name="course[1][1]"
                id="course_id_1_9"
               value="9"
                >
        Geometry 2                                              
    </label>
</td>                                       
<td class="credit_recovery"> 
    <label>
        <input type="checkbox" name="credit_recovery[1][9]"
                id="credit_recovery_id_1_9"
                >
    </label>
</td> 
<td class="waitlist">
        <label>
            <input type="checkbox" name="waitlist[1][9]"
                    id="waitlist_id_1_9"
                    >
        </label>
</td>

$(this)
   .parent().parent().siblings('.waitlist')
   .find(':checkbox').attr('checked', true);

我在每一个“这个”“最近的”“查找”等方面都失败了。也许需要考虑长度问题？

您可以试试

$class_table.find('input.radio:first-child').click(function (event)

要了解更多关于：第一个孩子访问的信息，您可以尝试

$class_table.find('input.radio:first-child').click(function (event)

要了解更多关于：第一个孩子访问的信息，请尝试以下操作

 var $class_table = JQuery('table.courses');
    $class_table.find('input.radio').click(function (event)
    {
      if($(this).parent().hasClass("waitlist"))
      {
        //DO your thing
      }
    });

如果单选按钮不是td的直接子项，则您可能必须执行。parent.parent

您也可以尝试.parent.next.waitlist或.parent.prev.waitlist

如果不起作用，请告诉我

试试这个

 var $class_table = JQuery('table.courses');
    $class_table.find('input.radio').click(function (event)
    {
      if($(this).parent().hasClass("waitlist"))
      {
        //DO your thing
      }
    });

如果单选按钮不是td的直接子项，则您可能必须执行。parent.parent

您也可以尝试.parent.next.waitlist或.parent.prev.waitlist

如果不起作用，请告诉我单击事件是否起作用？如果不是，我建议选择：

$class_table.find(":radio").click(function(event) {

如果是，那么下一步是相对于找到的收音机定位您的复选框。您可以按照@Imdad的建议简单地使用parent，或者多次调用parent，或者。在回拨中：

$(this).closest('tr').find('.waitlist :checkbox').attr('checked', true);

无论单选按钮嵌套得有多深，它都会找到父行，然后在带有类waitlist的列中搜索复选框。最后一个调用只有在find的结果为非空时才有效。工作示例

如果您希望在浏览结构时显式显示，则可以根据HTML代码片段，通过两次调用父级，一次调用同级，找到正确的列：

<tr class="course_full">
<td class="course_select", colspan=2>
    <label>
        <input type="radio" name="course[1][1]"
                id="course_id_1_9"
               value="9"
                >
        Geometry 2                                              
    </label>
</td>                                       
<td class="credit_recovery"> 
    <label>
        <input type="checkbox" name="credit_recovery[1][9]"
                id="credit_recovery_id_1_9"
                >
    </label>
</td> 
<td class="waitlist">
        <label>
            <input type="checkbox" name="waitlist[1][9]"
                    id="waitlist_id_1_9"
                    >
        </label>
</td>

$(this)
   .parent().parent().siblings('.waitlist')
   .find(':checkbox').attr('checked', true);

工作示例应产生与第一个相同的结果

注意：清除了答案，保留了正确的内容

单击事件是否正常工作？如果不是，我建议选择：

$class_table.find(":radio").click(function(event) {

如果是，那么下一步是相对于找到的收音机定位您的复选框。您可以按照@Imdad的建议简单地使用parent，或者多次调用parent，或者。在回拨中：

$(this).closest('tr').find('.waitlist :checkbox').attr('checked', true);

无论单选按钮嵌套得有多深，它都会找到父行，然后在带有类waitlist的列中搜索复选框。最后一个调用只有在find的结果为非空时才有效。工作示例

如果您希望在浏览结构时显式显示，则可以根据HTML代码片段，通过两次调用父级，一次调用同级，找到正确的列：

<tr class="course_full">
<td class="course_select", colspan=2>
    <label>
        <input type="radio" name="course[1][1]"
                id="course_id_1_9"
               value="9"
                >
        Geometry 2                                              
    </label>
</td>                                       
<td class="credit_recovery"> 
    <label>
        <input type="checkbox" name="credit_recovery[1][9]"
                id="credit_recovery_id_1_9"
                >
    </label>
</td> 
<td class="waitlist">
        <label>
            <input type="checkbox" name="waitlist[1][9]"
                    id="waitlist_id_1_9"
                    >
        </label>
</td>

$(this)
   .parent().parent().siblings('.waitlist')
   .find(':checkbox').attr('checked', true);

工作示例应产生与第一个相同的结果

---

注意：清理了答案，保留了正确的内容

有问题的HTML片段或页面链接会很有帮助。如果您可以在设置现有代码，那么我们可以在那里进行测试，并尝试为您不知道的jsfiddle.net找到解决方案-现在就做！我的在这里-@user973828检查我的更新答案，似乎我误解了最近的工作原理。。。所以，我写的——你们也包括在你们的小提琴里——并不能更好地使用显式父母、父母和兄弟姐妹。另外，还要检查大写字母——它是jQuery，而不是jQuery——除非您在实际代码中使用别名有问题的HTML片段或页面链接会很有帮助。如果您可以在设置现有代码，那么我们可以在那里进行测试，并尝试为您不了解jsfiddle.net的情况找到解决方案——现在就开始！我的在这里-@user973828检查我的更新答案，似乎我误解了最近的工作原理。。。所以，我写的——你们也包括在你们的小提琴里——并不能更好地使用显式父母、父母和兄弟姐妹。另外，还要检查大写字母-它是jQuery，而不是jQuery-除非您在实际代码中使用别名。单击事件正在工作，我知道这一点，因为它添加了一个突出显示行的类，加上我使用了一个警报。我认为你的第二个例子应该是正确的，但是这个框没有被选中。我已经摆弄过了，但还没有弄明白。奇怪的我相信你是对的。@user973828我刚刚更新了我的答案更新2，结果发现我错了。很高兴这有帮助。再想一想，使用最接近的方法确实是可行的：closesttr.find.waitlist:checkbox。选中它，应具有与父/父/同级相同的结果单击事件正在工作，我知道这一点，因为它添加了一个类，突出显示该行，并且我使用了一个警报。我认为你的第二个例子应该是正确的，但是这个框没有被选中。我已经摆弄过了，但还没有弄明白。奇怪的我相信你是对的。@user973828我刚刚更新了我的答案更新2，结果发现我错了。很高兴这有帮助。再想一想，使用最接近的方法确实是可行的：closesttr.find.waitlist:checkbox。检查一下，嘘 uld与父/父/兄弟具有相同的结果