-1

所以我在一张表中有一组图片，当用户选择一张图片时，它将该图片的 id 添加到 ul 中。如果用户取消选择图片，我将如何从 ul 中删除该项目？

这是我到目前为止的代码

 $('td.n, td.p').click(function() {

    if ($(this).hasClass('done')) {
        $(this).removeClass('done');
        $('#order').remove('#id');

    } else {

        var p = $('.picked');
        if (p.length == -1) {
            $(this).addClass('picked');

        } else {
            if ($(p[0]).text() == $(this).text()) {
                $(this).addClass('done');
                $('.picked').addClass('done')

                    var lst = $(this).attr('id');
                    var ul = $('<ul/>');
                    for (var i = 0; i < 1; i++) {
                        var li = $('<li/>');
                        li.html(lst);
                        ul.append(li);
                    }
                    $('#order').append(ul);


            }

        }
    }

});

一些 HTML

 <table>
            <tr>
                <td class='n' id='a1'><img src='seat_icon.jpg'/></td>
                <td class='n' id='a2'><img src='seat_icon.jpg'/></td>
                <td class='n' id='a3'><img src='seat_icon.jpg'/></td>
                <td class='n' id='a4'><img src='seat_icon.jpg'/></td>
                <td></td>
                <td class='n' id='a6'><img src='seat_icon.jpg'/></td>
                <td class='n' id='a7'><img src='seat_icon.jpg'/></td>
                <td class='n' id='a8'><img src='seat_icon.jpg'/></td>
                <td class='n' id='a9'><img src='seat_icon.jpg'/></td>
            </tr>
 </table

编辑：

如果我添加

 $('ul li').remove(lst);

它只是删除整个列表。无论如何，我只能删除一项？

添加了 jsfiddle 链接：

http://jsfiddle.net/xFvEx/1/

4

4 回答 4

0

如果你想从 dom（ul）中删除元素，只需使用.remove()

于 2013-02-18T16:47:22.270 回答
0

一种解决方案是在添加.data()变量ul时添加一个变量，然后测试该data变量是否存在：

            var lst = $(this).attr('id');
            var ul = $('<ul/>').data('text', lst);

            var ulexists = $('ul').filter(function () {
                return $(this).data('text') == lst;
            });
            if (ulexists.length) {
                ulexists.remove();
            } else {
                for (var i = 0; i < 1; i++) {
                    var li = $('<li/>');
                    li.html(lst);
                    ul.append(li);
                }
                $('#order').append(ul);
            }

http://jsfiddle.net/mblase75/xFvEx/

于 2013-02-18T16:52:20.300 回答
0

这种方法应该可以解决问题，如果没有，请尝试告诉我。

function deselect(id)
{
    $('#order').find('ul li').each(function(){
    if($(this).html()==id)
    {
        $(this).remove();
    }});
}

其中 id 是相关 td 的 id。

于 2013-02-18T16:53:07.787 回答
0

我认为问题出在

$('#order').remove('#id');

有了这个，你删除了 id="id" 的元素，它们是 id="order" bat 的元素的后代，你没有在 li 上设置任何 id。蝙蝠，你为什么把它弄得这么复杂。试试这个

 $('td.n, td.p').click(function() {

     $(this).toggleClass('picked');

     var ids = $(".picked").map(function(){
         return $(this).attr('id');
     });

     var ul = $('<ul/>');
     for (var i = 0 ; i < ids.length  ; i++){
         ul.append($('<li/>').text(ids[i]));
     }
     $('#order').empty().append(ul);
});

在http://jsfiddle.net/wftMz/5/上试试

于 2013-02-18T18:41:55.670 回答