如何在多选 jquery 插件中获取未经检查的值

Question

我在我的 ci 应用程序中使用多选 jQuery 插件

<div class="controls"><select name="delivery_method_' + cloneCntr + '[]" multiple="multiple" class="dm_list_data">' + delivery_method_options + '</select></div>';

$(function () {
    $('.dm_list_data').multiselect({
        includeSelectAllOption: true,
        buttonWidth: '170px',
        nonSelectedText: 'Select Delivery Method',
    });
});

我创建了一个关于变化的函数。在函数中我没有得到未经检查的值，它只显示检查的值：

$('.dm_list_data').on('change', function() {
    var ischecked= $(this).is(':checked');
    if(!ischecked){
        alert('uncheckd ' + $(this).val());  
    } else {
        alert("checked");
    }
}); 

Answer 1

希望对您有所帮助：

查看工作示例：https://jsfiddle.net/3b4dqhfc/5/

使用 jquery 的 not 来获得这样的期望结果

$(document).ready(function(){

  $('.dm_list_data').on('change', function() {

   /* use this for unselected value*/
   $('.dm_list_data option').not(':selected').each(function(k,v){
    console.log(k,v.text, v.value);
   });

   /* use this for selected value*/
   $('.dm_list_data :selected').each(function(k,v){
    console.log(k,v.text, v.value);
   });


  }); 
});

Answer 2

在每次更改时，将某些属性设置为未选中并将它们添加到数组中。

$('.dm_list_data').on('change', function() {
    var $sel = $(this);
    val = $(this).val();
    $opts = $sel.children();
    prevUnselected = $sel.data('unselected');
    var currUnselected = $opts.not(':selected').map(function() {
        if($("#new-input-"+this.value).length > 0){
            $("#new-input-"+this.value).remove();
        }
        return this.value
    }).get();
    var currSelected = $('.dm_list_data').val();
    $.each(currSelected, function(index, item) {
        if($("#new-input-"+item).length == 0){
            $("#new-options").append("<input type='text' id='new-input-"+item+"' value='"+item+"'>");
        }
    });
});

已根据需要更新

添加一个新的 div <div id="new-options"></div>