Сохранить значение переменной после удаления значений из элемента HTML

Question

Я использую библиотеку начальной загрузки tagsinput и храню значения тегов в переменной oldListValues. После того, как я выполню этот метод

$('#tagsinput').tagsinput( 'removeAll' );

Переменная oldListValues ​​становится пустой.

Есть ли способ сохранить значения в переменной после выполнения этого метода tagsinput, чем клонировать этот элемент и затем использовать значения из клонированного элемента?

Это часть кода, которую я использую:

if ( $('#tagsinput').tagsinput('items').length > 0 ) {

    $('#modal').modal('show');

    $('#button').click( function(e) {

        var oldListValues = $('#tagsinput').tagsinput('items');
        var mergedValues = $.merge( oldListValues, distValues );

        $('#tagsinput').tagsinput( 'removeAll' );
        $('#tagsinput').tagsinput( 'add', mergedValues.join('|') );

    });

}

Answer 1

Попробуй это

var oldListValues = $.extend([], $('#tagsinput').tagsinput('items')); 

Это клонирует вывод тегов на входе в новый массив, а не использует ссылку.

В зависимости от требований вашего браузера, вы также можете сделать это:

var oldListValues = [...$('#tagsinput').tagsinput('items')]

(не поддерживается в IE

Изменить: Вот скрипка для демонстрации: https://jsfiddle.net/jakelauer/tfgk87g3/