複数選択リストから選択解除されたオプションを取得

Question

私は複数選択リストを持っています。ユーザーが選択したオプションの選択を解除すると、ユーザーが選択しなかったオプションの値を知りたい。どのように私はそれをキャプチャするのですか？

私のサンプルコードは以下の通りです。

<select multiple> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="opel">Opel</option> 
    <option value="audi">Audi</option> 
</select> 

私が正しくあなたを理解していれば、私は複数のオプション

$('option').mousedown(function(){ 
    e.preventDefault(); 
    $(this).prop('selected', $(this).prop('selected') ? false :true); 
}); 

Answer 1

をユーザが選択することができるようにjqueryのコードを以下している、あなたは右、ちょうど選択されていない持ってオプションをしたいですか？

もしそうなら、これを試してみてください。

は、変数「lastSelectedValue」（または何でもあなたはそれを呼びたい）を作成します。このオプションを選択すると、選択したオプションを変更すると、あなたが値を取得することができ、それに割り当てると、それを使用し、再びそれをここ

var lastSelectedOption = ''; 
$('select').on('change', function(){ 
    //do what you need to do 
    lastSelectedOption = this.val(); 
}); 

を割り当てるフィドルます：https://jsfiddle.net/ahmadabdul3/xja61kyx/

複数で更新：https://jsfiddle.net/ahmadabdul3/xja61kyx/

これがあなたが必要とするものであるかどうかは不明です。

Answer 2

マウスイベントが

私の提案は、選択の前の値の常に店舗配列になり利用でき、クロスブラウザではありませんフィードバックを提供してください。すべてのオン

あなたが前値の配列と比較することができますし、他の人が述べたように一度更新格納された配列

$('#myselect').on('change', function() { 
    var $sel = $(this), 
    val = $(this).val(), 
    $opts = $sel.children(), 
    prevUnselected = $sel.data('unselected'); 
    // create array of currently unselected 
    var currUnselected = $opts.not(':selected').map(function() { 
    return this.value 
    }).get(); 
    // see if previous data stored 
    if (prevUnselected) { 
     // create array of removed values   
     var unselected = currUnselected.reduce(function(a, curr) { 
     if ($.inArray(curr, prevUnselected) == -1) { 
      a.push(curr) 
     } 
     return a 
     }, []); 
     // "unselected" is an array 
     if(unselected.length){ 
     alert('Unselected is ' + unselected.join(', ')); 
     } 

    } 
    $sel.data('unselected', currUnselected) 
}).change(); 

DEMO

Answer 3

見つけ、キーを比較するのだろう変更以前選択された値と現在の値。削除された値を把握する必要があるので、lastSelected.length > currentSelected.lengthが存在するかどうかを確認し、lastSelectedからcurrentSelectedを置き換えて結果を取得するだけです。

var lastSelected = ""; 
$('select').on('change', function() { 
    var currentSelected = $(this).val(); 
    if (lastSelected.length > currentSelected.length) { 
     var a = lastSelected.toString().replace(currentSelected.toString(),""); 
     alert("Removed value : " + a.replace(",","")); 
    }  
     lastSelected = currentSelected; 
}); 

の作業例：https://jsfiddle.net/DinoMyte/cw96h622/3/

Answer 4

グレート質問、私は、データ属性を使用して選択されていないオプションを検出するためのいくつかのコードを書きました。

$('#select').on('change', function() { 
 
    var selected = $(this).find('option:selected'); 
 
    var unselected = $(this).find('option:not(:selected)'); 
 
    selected.attr('data-selected', '1'); 
 
    $.each(unselected, function(index, value){ 
 
    \t if($(this).attr('data-selected') == '1'){ 
 
     \t  //this option was selected before 
 
      alert("I was selected before " + $(this).val()); 
 
      $(this).attr('data-selected', '0'); 
 
     } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select multiple id="select"> 
 
<option data-selected=0 value="volvo">Volvo</option> 
 
<option data-selected=0 value="saab">Saab</option> 
 
<option data-selected=0 value="opel">Opel</option> 
 
<option data-selected=0 value="audi">Audi</option> 
 
</select>

Answer 5

あなたはそれが

$('#link_to_id').find('option').not(':selected').each(function(k,v){ 
    console.log(k,v.text, v.value); 
}); 

値