從排序列表中刪除的項目仍然顯示在陣列中

我有兩個可排序的列表，然後是一個按鈕。用戶將第一個列表中的項目添加到第二個列表中，然後當他們單擊按鈕時，我有一些腳本從第二個列表中收集列表項目標識。這部分按預期工作。從排序列表中刪除的項目仍然顯示在陣列中

我的問題是，當用戶不小心將項目添加到他們想要刪除的第二個列表。我有一個垃圾桶圖標，用於從列表中刪除項目，但當您點擊按鈕以獲取數組時，它仍然包含數組中已刪除的列表項。我如何避免這種情況？我應該在添加和刪除項目時構建數組，還是可以在完成後移動列表項目（如我在此處所做的那樣）後才構建它？

感謝您的參觀！

http://jsfiddle.net/vYu5k/

<div class="avail_segments_wrap"> 
    <ul id="available" class="segments_available">Available Segments 
     <li id="1"><span class="title">Item 1</span><a href="#" class="ui-icon ui-icon-add"></a></li> 
     <li id="2"><span class="title">Item 2</span><a href="#" class="ui-icon ui-icon-add"></a></li> 
     <li id="3"><span class="title">Item 3</span><a href="#" class="ui-icon ui-icon-add"></a></li> 
     <li id="4"><span class="title">Item 4</span><a href="#" class="ui-icon ui-icon-add"></a></li> 
     <li id="5"><span class="title">Item 5</span><a href="#" class="ui-icon ui-icon-add"></a></li> 
     <li id="6"><span class="title">Item 6</span><a href="#" class="ui-icon ui-icon-add"></a></li> 
    </ul> 
</div> 

<br> 

<div class="chosen_segments_wrap"> 
    <ul id="chosen" class="segments_chosen">Chosen Segments 
    </ul> 
</div> 

<button type="button" id="button1">Button1</button>

的jQuery：

//make lists sortable 
$("#available").sortable({ 
    connectWith: "#chosen" 
}); 
$("#chosen").sortable({ 
    connectWith: "#available" 
}); 

//make add and trash icons functional 
$('.ui-icon-add, .ui-icon-delete').on('click', function() { 
    item = $(this).parent(); 
    item.fadeOut(function() { 
     if (item.parent().attr('id') == 'chosen') { 
      $('#available').remove(item.fadeIn()); 

     } else { 
      $('#chosen').append(item.fadeIn()); 
     } 
    }); 
}); 

//hit button to collect all li id's from ul "chosen". 
$("#button1").click(function() 
      { 
      var chosenArray = []; 
       $('#chosen li').each(function(){ 
       chosenArray.push($(this).attr('id')); 
        }); 
       alert(chosenArray) 
      } 
     );

來源

2014-03-06 JackBurton

Fiddle Demo

$("#button1").click(function() { 
    var chosenArray = []; 
    $('#chosen li:visible').each(function() {

你都躲在 li在刪除。但是，當你創建數組你正在服用的所有 li元素

，你需要選擇唯一可見的元素$('#chosen li:visible').

讀 :visible

來源

2014-03-06 16:37:22

從排序列表中刪除的項目仍然顯示在陣列中

回答

相關問題