如何用特定的类隐藏最接近的元素？

Question

我想在选中复选框后隐藏.panel。但它没有隐藏：

 $(".done").on("change", function () {
   if ($(this).is(":checked")) {
     $(this).closest(".panel").hide;
   } 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<li class="panel" style="background:#f4f4f4;">
    <table style="width:100%">
        <tbody>
            <tr>
                <td style="width:45px">
                    <span class="handle ui-sortable-handle">

                    </span>
                    <input class="done" type="checkbox">
                </td>


                <td>
                    <span  style="min-width:100px;min-height:20px;margin-left:0px">Please hide this on check</span>

                </td>

            </tr>
        </tbody>
    </table>

</li>

Answer 1

您输了一个拼写错误：调用函数hide()而不是.hide

 $(".done").on("change", function () {
   if ($(this).is(":checked")) {
     $(this).closest(".panel").hide();
   } 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<li class="panel" style="background:#f4f4f4;">
    <table style="width:100%">
        <tbody>
            <tr>
                <td style="width:45px">
                    <span class="handle ui-sortable-handle">

                    </span>
                    <input class="done" type="checkbox">
                </td>


                <td>
                    <span  style="min-width:100px;min-height:20px;margin-left:0px">Please hide this on check</span>

                </td>

            </tr>
        </tbody>
    </table>

</li>

Answer 2

叫我傻但你忘了隐藏**（）**括号jajajja，这里是demo

$(".done").on("change", function () {
console.log($(this), $(this).closest(".panel"));
   if ($(this).is(":checked")) {
     $(this).closest(".panel").hide();
   } 
});