从与其他列表项的索引相等的列表中删除项

delete items from a list that equals to index of other list item

本文关键字：列表 删除 索引 其他      更新时间：2023-09-26

我有两个列表：

<ul id="listone">
<li><input type="checkbox"/>item 1</li>
<li><input type="checkbox"/>item 2</li>
<li><input type="checkbox"/>item 3</li>
</ul>

<ul id="listtwo">
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
</ul>

我想取消选中列表一中的一个项目，这样它就可以在列表二中找到确切的值，并从列表二中删除该值。

我正试图为列表二项分配一个id，该id等于未选中项1时项1的索引号，并删除列表二项中id=我从列表一中未选中项的索引的项。到目前为止，这是我的代码：

$("input.selectme").bind('change',function() {
    var ix = $(this).index(".selectme");
    //var panelix = $("#panel ol li span").html();
    var checked = $(this).is(':checked');   
    var fileurl = $(this).next("label").attr("rel");
    var filename = $(this).next("label").text().replace("&nbsp;","").trim();
    var getlength = $(".fileslist li").length;

            if(checked===true) {                
                $("#panel ol").prev("h5").html("Your list currently has:");
                curl = localStorage.curl="<div class='delete'><'/div><li id="+ix+"><a href='"+fileurl+"'>"+filename+"<'/a><'/li>";
                $("#panel ol").append(localStorage.curl); //creating a new item in the list
                $("#panel .btn").css("display","block");

            }
            else{   
            //ix = $(this).index();             
            for(i=0;i<$("#panel ol li").length;i++){                                
                if(ix === $(this).attr("id")){
                    alert("pl");
                    $(this).css("color","red");
                    }                   
                $(this).attr("id",ix).css("border","solid 1px red");
                }

我做不到。。。任何帮助都将不胜感激。。。提前感谢

复选框this:

<ul id="listone">
<li><input type="checkbox" class='chk' value="item1"/>item 1</li>
<li><input type="checkbox" class='chk' value="item2"/>item 2</li>
<li><input type="checkbox" class='chk' value="item3"/>item 3</li>
</ul>
<ul id="listtwo">
<li class="list_item1">item 1</li>
<li class="list_item2">item 2</li>
<li class="list_item3">item 3</li>
</ul>
<ul id="listThree">
<li class="list_item1">other item 1</li>
<li class="list_item2">other item 2</li>
<li class="list_item3">other item 3</li>
</ul>
    $(".chk").click(function () {
            var isChecked = $(this).is(':checked');
            if (!isChecked) {
                var itemId = $(this).val();
                $(".list_" + itemId).hide();
            }          
        });

如果删除第二个列表中的li元素，索引将不再匹配，相反，我建议：

$('#listone input[type="checkbox"]').change(function(){
    var prop = text = this.nextSibling.nodeValue;
    if (this.checked) {
        $('#listtwo li').filter(function(){
            return text === $.trim($(this).text());
        }).remove();
    }
});

JS Fiddle演示。

相关文章：