jquery - 有没有办法针对前一个元素？

Question

我正在处理由我的 CMS 生成的表单。表单在一个表中生成，该表在大多数情况下几乎没有 ID 或类来获取和操作内容。

这是我正在处理的部分的示例:

<tr>
    <td>
        <label class="wrappable" id="4354-3-34-2324">
           <span class="explicit">
               "Give me your answer"
           </span>
        </label>
        <br/>
        <span>
            <textarea></textarea>
        </span>
        </br>
    </td>
</tr>

我有一个问题显示在这个问题之上，根据输入的是或否，我希望能够隐藏/显示这段代码。

我唯一能想到的用一个语句隐藏这个问题的方法是使用标签的 id，然后以某种方式达到 td 的级别并将其显示设置为无。这样我就可以根据对上面问题的回答轻松地使用 jQuery 切换它的可见性。

有谁知道这是否可行，或者是否有更简单的方法可以解决这个问题？

Answer 1

The only thing I can think of to hide this question all with one statement is to use the id of the label and then somehow reach up a level to the td and set it's display to none. That way I can easily toggle it's visibility with jQuery based on the response to the question above it.

如果你想要一个特定元素的直接父元素，你可以使用 parent() jQuery 中的函数:

// This would hide the parent element for your specific element
$('#4354-3-34-2324').parent().hide();

如果您需要超出此范围，可以使用 closest() 函数遍历 DOM 以通过选择器找到最近的元素:

// This would hide the closest <td> element for your specific 
$('#4354-3-34-2324').closest('td').hide();

既然你想根据你的问题的结果触发它，你可以听你的特定 <textarea>元素并确定它们何时更改并相应地显示/隐藏:

$(document).on('change','textarea',function(){
     // When a text area has changed, check it's value
     var text = $(this).val();
     // Use the text here to determine how to handle what you need
     if(condition){ 
         // Hide the nearest <td> if your condition is met
         $(this).closest('td').hide();
     }
});