刪除項目後重置下拉列表

Question

單擊按鈕時，我使用detach-method從下拉列表中刪除多個項目。我也有一個重置按鈕 - 但我不知道如何重置我的下拉菜單。

$("#presets option[value='" + id + "']").detach(); 

Answer 1

如果要恢復已刪除的項目，而爲了保存並不重要，解決方法很簡單：

var removed = []; 
// your buttons to remove single items 
$('#remove1').on('click', function() { 
    removed.push($('#presets option[value="1"]').detach()); 
}); 
$('#remove2').on('click', function() { 
    removed.push($('#presets option[value="2"]').detach()); 
}); 
// button to restore items 
$('#restore').on('click', function() { 
    removed.forEach(function ($e) { 
     $('#presets').append($e); 
    }); 
}); 

jsFiddle

---

如果保存訂單很重要，那麼您需要在恢復之前對元素進行排序：

var removed = $(); 
$('#remove1').on('click', function() { 
    removed = removed.add($('#presets option[value="1"]').detach()); 
}); 
$('#remove2').on('click', function() { 
    removed = removed.add($('#presets option[value="2"]').detach()); 
}); 
$('#restore').on('click', function() { 
    var $opts = removed.add('#presets option'); 
    removed = $(); 
    $opts.sort(function(a, b) { 
     return parseInt($(a).attr('value')) > parseInt($(b).attr('value')); 
    }); 
    $('#presets').html($opts); 
}); 

jsFiddle