Question

您好我有一个按钮将项目附加到列表中，
选择某个项目时，将隐藏所有其他项目，并且仅显示所选项目。

目标：
我想要的是只拥有最后一个＆＃34;附加项目以显示目前，所有最近添加的项目都显示在列表中。

jQuery将项目附加到List：

//AppendImagePreview
$(function() {
    var itemCount = 1;
$("#addImageButton").click(function(e) {  
    e.preventDefault();
    var itemCount = ($("[id^='item-']").length + 1);

var elementPreview = $("<li id='item-" + itemCount + "'></li>");

 $("#cardList").append(elementCard);
  $("#previewList").append(elementPreview);
    });
});

jQuery隐藏除所选项目之外的所有内容：

var lastSelectedCardDataType;
var lastSelectedPreviewItemId;
var lastSelectedCardId;
var onClickCard = function(dst){    
    var t = dst.id;
    console.log('dst.id=' + dst.id);
    console.log('t=' + t); //(t = item-2)

    $('.previews').hide(); //hide ok

    var q = '#prw-' + t; //change to class (q = prw-item-2)
    console.log('t=' + t);
    console.log('q=' + q); //not showing

    lastSelectedCardDataType = $(dst).attr("data-type");
    lastSelectedPreviewItemId = q;
    lastSelectedCardId = "#"+ t;

    console.log("lastSelectedPreviewItemId"+lastSelectedPreviewItemId);
    console.log("lastSelectedCardId"+lastSelectedCardId);

    $(q).show();
};

列表附加位置：

<ul id="previewList" class="previewList">
    <li></li>
</ul>

Answer 1

您可以将上一个附加项放入全局变量

var lastAppendedId;
$(function() {
    var itemCount = 1;
    $("#addImageButton").click(function(e) {  
        e.preventDefault();
        var itemCount = ($("[id^='item-']").length + 1);

        var elementPreview = $("<li id='item-" + itemCount + "' class ='listItem'></li>");
        lastAppendedId = elementPreview.attr('id');
        $("#cardList").append(elementCard);
        $("#previewList").append(elementPreview);
    });
});

然后Onclick你可能想迭代listItems并隐藏除lastAppended项目之外的所有项目

$('.listItem').each(function() {
  var currentId = this.id;
  if(currentId !== lastAppendedId) {
    $(this).hide();
  }
);

jsfiddle：http://jsfiddle.net/sir4ju1/3NrgX/

jQuery：当项目附加到List时，只显示一个项目

1 个答案: