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 ，然后在該元素內找到該復選框。