无法在嵌套列表中选择ul和li元素

时间:2012-10-09 17:11:43

标签: jquery nested html-lists

我有这个代码由jQuery生成,可以是n级的ul和n-list项

<ul id="criteria">
<li>
    Goal
    <img id="add_criterion" class="add_criterion" src="../images/icons/add-icon.png">
    <ul id="1" class="criteria">
        <li id="1">
        criteria 1
            <ul id="2" class="criteria">
                <li id="2"> criteria 1
                    <ul id="3" class="criteria">
                       <li id="3">criteria 1</li>
                       <li id="4">criteria 2</li>
                    </ul>
                </li>
                <li id="3"> criteria 2</li>
            </ul>
        </li>
        <li id="2"> criteria 2</li>
    </ul>
</li>
</ul>

我想删除对应于其id和级别的li,我写了这个函数,其中level是ul的id,而我是li的id

function removeElementLi(i,level){
// if one list item in un order list

if($("ul#criteria ul#"+level+" li").length ==1){
    $("ul#criteria ul#"+level).remove();
}else{
    $("ul#criteria ul#"+level+" li#"+i).remove();
}   
}

但它没有用,任何帮助我都很感激。

我将功能更改为

if($("ul[id="+level+"][class=criteria] li").length ==1){
    $("ul[id="+level+"][class=criteria]").remove();
}else{
    $("ul[id="+level+"][class=criteria] li#"+i).remove();
}

但是对于这个HTML代码

 <ul id="criteria">
    <li>Goal
    <img id="add_criterion" class="add_criterion" src="../images/icons/add-icon.png">
        <ul id="1" class="criteria">
            <li id="1">criteria 1</li>
            <li id="2">criteria 2</li>
        </ul>
    </li>
 </ul>

当我开始删除第二个li时,它可以正常工作,但是当我开始删除第一个li时,它无效。我提醒jQuery语句

ul[id=1][class=criteria] li#1

,在这种情况下长度为2

2 个答案:

答案 0 :(得分:1)

注意:ID必须唯一

问题是您使用ul#criteria它应该是ul.criteria,因为criteria是一个类

请查看jquery id selectorclass selector

答案 1 :(得分:1)

如果页面上的multiple elements具有相同的ID,并使用ID选择器选择元素,则选择器引擎会选择遇到的第一个ID。

尝试使用class代替id