首页 文章

如果最近的td.classname中有一个复选框，请检查它

提问于
浏览 次
2

我有一个预订表单，列出了带有单选按钮的类，用于预订课程 . 如果类已满，则使用类的单选按钮在行上显示等待列表复选框 . 在jQuery中，如果单击一个完整的类单选按钮，我希望jQuery检查waitlist复选框 . 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>

我在每次'这''最接近''找到'等方面都失败了 . 也许长度需要涉及？

jquery checkbox

3 回答

  • 2

    试试这个

    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") or .parent().prev(".waitlist")

    如果不起作用，请告诉我

    回复于
  • 1

    你可以试试

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

    了解更多信息：亲子访问first-child-selector

    回复于
  • 1

    click 活动有效吗？如果它's not, I'建议:radio选择器：

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

    如果是，则下一步是找到相对于找到的无线电的复选框 . 你可以简单地使用 parent 作为@Imdad建议（或多次调用父）或者closest . 在你的回调中：

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

    它将找到父行（无论您的单选按钮的嵌套程度如何），然后搜索复选框 inside 列为 waitlist 的列 . 如果 find 的结果非空，则最后一次调用只会产生任何影响 . jsFiddle的工作示例

    如果您希望在导航结构时明确，则可以根据HTML代码段找到正确的列，其中包含2次调用 parent 和1次调用 siblings ：

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

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

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

    回复于

相关问题