jquery - JQuery を使用した検索と破棄

Question

選択したすべてのオプションが 1 回だけ発生するようにする最善の方法は何ですか?

例えば：

1. ユーザーは、col_1 選択ボックスから「SSN」を選択します
2. 次に、ユーザーは col_2 から「姓」を選択します
3. ユーザーが col_3 から誤って「SSN」を選択

SSN が選択された前の選択ボックス (col_1) をクリア (value="") できるようにしたい

JS:

$(document).ready(function(){

    $("select").change(function(){

        var selectedColVal = $(this).val();                 
        var selectedCol = $(this).attr('id');

        //todo: see if currently selected value has already been selected
        //and clear the previous selectbox


    });

});

HTML:

<div id="col_1">
      <select id="column_1" name="column_1">
         <option value="">Select Column Name</option>
         <option value="First Name">First Name</option>
         <option value="Last Name">Last Name</option>
         <option value="Email">SSN</option>
      </select>
</div>
<div id="col_2">
      <select id="column_2" name="column_2">
        <option value="">Select Column Name</option>
        <option value="First Name">First Name</option>
        <option value="Last Name">Last Name</option>
        <option value="Email">SSN</option>
    </select>
</div>
<div id="col_3">
  <select id="column_3" name="column_3">
    <option value="">Select Column Name</option>
    <option value="First Name">First Name</option>
    <option value="Last Name">Last Name</option>
    <option value="Email">SSN</option>
</select>
</div>

Answer 1

このような：

$(document).ready(function(){

    $("select").change(function(){

        var selectedColVal = $(this).val();                 
        var selectedCol = $(this).attr('id');

        // find select (except current) that has same value selected
        var $tmp = $("select:not(#" + selectedCol + ") option[value='" + selectedColVal + "']:selected").parent();
        // clear value
        $tmp.val("");
    });

});

ライブサンプル

Answer 2

このようなものをお探しですか？

$(document).ready(function () {
    var selects = $("select"); // cache
    selects.change(function () {
        var self = $(this),
            others = selects.not(self);
        others.each(function (i, elem) {
            var other = $(elem);
            if (other.val() ===  self.val()) {
                other.val('');
            }
        });
    });
});

作業フィドル: http://jsfiddle.net/kUHh5/