2014-04-21 159 views
-1

您好我有一個按鈕,將項目追加到列表中,
當選擇一個項目時,所有其他項目都隱藏,並且只顯示所選項目。jQuery:只顯示一個項目,當項目追加到列表

目的:
我想是有隻有「最後一個」附加項目展示。
目前,所有最近添加的項目都顯示在列表中。

jQuery的追加項目名單:

//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> 

回答

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/