2つの選択フィールドをリンクしてお互いのオプションを削除する方法

Question

同じオプションを持つ2つのフィールドがあります。私は、ユーザーがそのうちの1つから1つのオプションを選択すると、反対のフィールドにこの同じオプションが削除されることを確認したい。

したがって、ユーザーがT. EdsonをRecipientと選択すると、このオプションはCCsフィールドで削除されます。

は、私は誰かが hereを言ったように、次の試みたが、動作するようには思えません。コード全体を見ずに

function checkAddressFields() { 
     var recipientField = $('#id_recipient'); 
     var ccsField = $('#id_ccs'); 
     console.log("Removing duplicate"); 
     $("#id_ccs option[value='"+recipientField.val()+"']").remove(); 
     ccsField.trigger("chosen:updated"); 
    } 
    $('#id_recipient').on('change', checkAddressFields); 
    $('#id_ccs').on('change', checkAddressFields); 

Answer 1

てみてくださいこの例..

$select = $('.select'); 
 
$select.on('change', function() { 
 
    var val = $(this).val(); 
 
    $notThis = $select.not($(this)); 
 
    $notThis.find('option').show(); 
 
    $notThis.find('option[value=' + val + ']').hide(); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<select class="select"> 
 
    <option>Select rec</option> 
 
    <option value="option1">Option 1</option> 
 
    <option value="option2">Option 2</option> 
 
    <option value="option3">Option 3</option> 
 
    <option value="option4">Option 4</option> 
 
    <option value="option5">Option 5</option> 
 
</select> 
 

 
<select class="select"> 
 
    <option>Select cc</option> 
 
    <option value="option1">Option 1</option> 
 
    <option value="option2">Option 2</option> 
 
    <option value="option3">Option 3</option> 
 
    <option value="option4">Option 4</option> 
 
    <option value="option5">Option 5</option> 
 
</select>

Answer 2

は、それは少しトリッキーなことが、（recipientField.valは（）checkAddressFieldsに渡されていることを確認して（））は、このような何かしてみてください可能性があります

$("#id_ccs option[value='+recipientField.val()+']").remove();