簡體   English   中英

jQuery幫助同時選擇父母和子女,但不幫助祖先的兄弟姐妹

[英]jquery help selecting parents and children at the same time, but not siblings of ancestors

我正在嘗試編寫一個jQuery調用,以在用戶選中復選框ul菜單時選擇“兒童”和“父母”。

這個jquery正確地選擇了父母和孩子,但是在遍歷父母時也選擇了兄弟姐妹。

//Check the Parents
$(this).parents().find("input").checkUncheck(true);


//Check the Children
$(this).parent().siblings("ul").find("input").checkUncheck(true);

我不希望它在遍歷祖先以選擇“父母”時選擇兄弟姐妹,但我不知道如何進行jquery。 如果有人對如何操作有一些提示,我將不勝感激!

謝謝。

以下是HTML:

<ul id="p_menu_nav">
    <li>    
        <span>
            <input type="checkbox" title="no"> 
            <img images/minus.gif" class="a_hand"> Wells Fargo
        </span>
        <ul >
            <li >
                <span>
                    <input type="checkbox" title="no"> 
                    <img src="images/plus.gif" class="a_hand"> Southern Utah
                </span>
            </li>
            <li >
                <span>
                    <input type="checkbox" title="no"> 
                    <img src="images/plus.gif" class="a_hand"> Northern Utah
                </span>
            </li>
            <li >
                <span>
                    <input type="checkbox" title="no"> 
                    <img images/minus.gif" class="a_hand"> Central Utah
                </span> 
                <ul >
                    <li>
                        <input type="checkbox" name="approved_property_id_list" id="4835">Apartment 1
                    </li>
                    <li>
                        <input type="checkbox" name="approved_property_id_list" id="4844">Apartment 10
                    </li>
                    <li>
                        <input type="checkbox" name="approved_property_id_list" id="4934">Apartment 100
                    </li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

嘗試這樣的事情:

    $(this).parents('li').find("> span > input").checkUncheck(true);

    //Check the Children
    $(this).closest('li').find('input').checkUncheck(true);

JSFiddle示例

嘗試這個 :)

$(function(){
    $("#p_menu_nav input").click(function(){
        var that = "#"+this.id;
        $("#p_menu_nav li:has(img)").each(function(){
            if($(this).contents().find(that).length > 0){
                $(this).find(">span input").attr("checked",true);
            }
        });
    });
});
  1. 點擊功能-僅用於測試
  2. 記住clicked元素的ID
  3. 選擇所有分支(我假設所有分支都有img,但也可能是跨度)
  4. 檢查是否在該分支中
  5. 如果是,則選中復選框(您已使用過功能checkUncheck(true))

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM