使用jquery检查是否存在嵌套的ul和lis

时间:2014-07-10 15:59:49

标签: jquery

我有以下嵌套ul和lis的代码。我想在任何有一个ul子项的li中添加一个带有jquery的类。这是JSBIN

<ul class="tree" id="tree">

    <li><input type="checkbox" name="account_settings" value="yes">Account Settings
        <ul>
            <li><input type="checkbox" name="one" value="one">AS One</li>
            <li><input type="checkbox" name="two" value="two">AS Two</li>
            <li><input type="checkbox" name="user_roles" value="user_roles">Users &amp; Roles
                <ul>
                    <li><input type="checkbox" name="user_role" value="add">Add</li>
                    <li><input type="checkbox" name="user_role" value="delete">Delete</li>
                </ul>
            </li>
        </ul>
    </li>

    <li><input type="checkbox" name="rl_module" value="yes">RL Module</li>

    <li><input type="checkbox" name="rl_module" value="yes">Accounting
        <ul>
            <li><input type="checkbox" name="vat" value="yes">VAT</li>
            <li><input type="checkbox" name="bank_account" value="yes">Banking
                <ul>
                    <li><input type="checkbox" name="view" value="yes">View</li>
                    <li><input type="checkbox" name="crud" value="yes">CRUD</li>
                </ul>
            </li>
        </ul>
    </li>

</ul>

的jQuery

$('#tree > li').each(function(){    
    if($(this).has('ul')){
        $(this).prepend('<i class="fa fa-caret-right"></i>');
    }    
});

3 个答案:

答案 0 :(得分:1)

$('#tree ul').parent('li').addClass('fa fa-caret-right');

&#34;如果我在#tree中找到了一个ul,那么就为它添加一个类,即父母&#34;

JSBin:http://jsbin.com/kekugopi/2/edit

答案 1 :(得分:0)

如果我理解你的问题,你应该替换

$(this).prepend('<i class="fa fa-caret-right"></i>');

$(this).addClass("myAddedClass");

答案 2 :(得分:0)

这应该只针对第一级别的诀窍:

$('#tree > li').has('ul').prepend('<i class="fa fa-caret-right"></i>');

如果您想在所有使用ul作为儿童使用的li上使用相同的代码:

$('#tree li').has('ul').prepend('<i class="fa fa-caret-right"></i>');

(注意缺少&#34;&gt;&#34;)