jQuery遍历父母以找到主要父母的先前元素

Question

HTML：

<li>
    <h2 class="tree_header"><input type="checkbox" name="no_name" class="visual_astetics" data-headcheck="yes"> Network Throttle</h2>
    <ul class="tree_collapse">
        <li>
            <ul>
                <li>Throttle Network speeds to <input type="text" name="job_nw_throttle_rate" id="job_nw_throttle_rate" style="width:50px;" placeholder="no limit" data-multiple="yes" data-autosave="postHandler" data-autosave_end="" data-autosave_uri="/api/jobs/setproperty"><span class="small_text italic">(kbits/s)</span></li>
                <li>
                    <h2 class="tree_header">Set Start &amp; Stop times for Network Throttle</h2>
                    <ul class="tree_collapse">
                        <li>
                            <ul>
                                <li>
                                    Throttle starts at <input type="text" name="job_nw_throttle_start" id="job_nw_throttle_start" style="width:30px;" placeholder="0" data-multiple="yes" data-autosave="postHandler" data-autosave_end="" data-autosave_uri="/api/jobs/setproperty"> (local time / 24-Hour format)
                                </li>
                                <li>
                                    Throttle finishes at <input type="text" name="job_nw_throttle_end" id="job_nw_throttle_end" style="width:30px;" placeholder="0" data-multiple="yes" data-autosave="postHandler" data-autosave_end="" data-autosave_uri="/api/jobs/setproperty"> (local time / 24-Hour format)
                                </li>
                            </ul>
                        </li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>
</li>

这是更大的数据集的一部分。 我要尝试做的是，当发现本示例中包含的任何输入中的数据正在加载时，该数据与它的占位符不相等，该数据沿ul/li集的堆栈遍历到顶部li 。 公平地假设有多个主li ，如本示例所示。 但是在这种情况下，我对h2元素中具有visual_astetics thats类的复选框感兴趣。 到目前为止，当我找到与众不同的东西并以此为基础做其他事情时，我有想要工作的一切。 但是，如果您会进行编程的话，我似乎无法“找到”该复选框。

我试过使用parents() ， parentsUntil() ， closest()和其他几个以及它们的组合。 但还没有找到复选框或H2其要承担的另一件事是HTML可能无法编辑就目前的结构，所以加入一个停止点，如果你将通过在此之上ID或类或其他li可能不目前可能。 假设这些层可以比此处显示的要深得多，这也是很好的做法。 综上所述，有什么想法可以找到该复选框吗？

Answer 1

也许您可以将parents()函数与:has选择器结合使用，以找到具有匹配复选框的父控件，然后找到该复选框。 就像是

假设changedInput是一个jquery对象，其中包含与占位符不再匹配的输入，例如#job_nw_throttle_start。

var visualAstheticsCheckbox = changedInput.parents('li:has(input.visual_asthetics)').find('input.visual_asthetics');

因此，它应该沿着树走，直到找到一个在其中具有该类某个复选框的li ，然后在该元素内找到该复选框。