выберите и снимите выделение из выпадающего списка

Question

В раскрывающемся списке jQuery multiselect я хочу, чтобы элемент проверял его на массив, и если элемент не отмечен, он удаляется из этого массива. Я сделал:

var optionValues = []; 
$("#myselect").change(function() { 
    $("select option:selected").each(function() { 
     optionValues.push($(this).val()); 
    }); 

    $('select option:not(:selected)').each(function() { 
     itemtoRemove = $(this).val(); 
     optionValues.splice($.inArray(itemtoRemove, optionValues), 1); 
    }); 
    $('#this').val(optionValues.join()); 
}).trigger("change"); 

<input type="text" id="this"> 

но ничего не показывает в текстовом поле. Есть идеи?

Answer 1

Для создания массива гораздо проще использовать map(), а также создавать новый массив при каждом изменении, поэтому вам не нужно беспорядочно находить определенный элемент массива для удаления. Попробуйте это:

var optionValues = []; 
$('#myselect').change(function() { 
    optionValues = $('option:selected', this).map(function() { 
     return this.value; 
    }).get(); 
    $('#this').val(optionValues.join()); 
}).trigger('change'); 

Example fiddle

Answer 2

Проблема заключается в том, что вы не проверяли возвращения $.inArray(itemtoRemove, optionValues) вызова.

$('select option:not(:selected)').each(function() { 
     itemtoRemove = $(this).val(); 
     var index = $.inArray(itemtoRemove, optionValues); 
     if(index != -1) { 
      optionValues.splice(index,1); 
     } 
}); 

http://jsfiddle.net/00shke8a/

Answer 3

$("#myselect").change(function() { 
var optionValues = []; 
$("select option:selected").each(function() { 
    optionValues.push($(this).val()); 
    }); 

$('#this').val(optionValues.join()); 
}).trigger("change"); 

http://jsbin.com/gejigucimo/1/edit