javascript - DOM 遍历查找父项的兄弟项

Question

如果我想创建一个事件，在单击 .radio-click-hide 时隐藏 .dependent-box 部分，我将如何遍历元素来实现发生？我已经试过了，但没有成功:

jQuery(function ($) {
    $('.radio-click-hide').on("click", function (e) {
       $(this).closest('.dependent-box').hide() 
    });
}); 

另外，我的程序中有很多这样的东西，所以它需要定位最近的 .dependent-box

<table>
    <tr class="form-group">
        <td class="form-label">
            @Html.LabelFor(model => model.IsAchievedByLiveMeeting, htmlAttributes: new {@class = "control-label"})
        </td>
        <td class="form-input">
            @Html.RadioButtonFor(model => model.IsAchievedByLiveMeeting, true, new { @class = "radio-click-hide" }) Yes
            @Html.RadioButtonFor(model => model.IsAchievedByLiveMeeting, false, new { @class = "radio-click-show" }) No
            @Html.ValidationMessageFor(model => model.IsAchievedByLiveMeeting, "", new {@class = "text-danger"})
        </td>
    </tr>
    <tr class="form-group dependent-box">
        <td class="form-label"></td>
        <td class="form-input">
            @Html.LabelFor(model => model.LiveMeetingExplaination, htmlAttributes: new {@class = "control-label"})
            @Html.EditorFor(model => model.LiveMeetingExplaination, new {htmlAttributes = new {@class = "form-control"}})
            @Html.ValidationMessageFor(model => model.LiveMeetingExplaination, "", new {@class = "text-danger"})
        </td>
    </tr>
</table>

Answer 1

closest() 单独不起作用，因为 .dependent-box 元素是复选框的父级 tr 的同级元素。试试这个:

$('.radio-click-hide').click(function() {
    $(this).closest('tr').next('.dependent-box').hide()  
});