jquery - アイテムを削除した後にドロップダウンをリセットする

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);
    });
});

jsフィドル

---

順序の維持が重要な場合は、復元する前に要素を並べ替える必要があります。

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);
});

jsフィドル