如何链接两个选定的字段,以便相互删除选项

时间:2016-06-14 07:37:26

标签: javascript jquery jquery-chosen

我有两个具有相同选项的字段。我想确保当用户从其中一个中选择一个选项时,相反的字段将删除相同的选项。

因此,如果用户选择T. Edson为Recipient,则此选项将在CCs字段中删除。

enter image description here

我尝试了以下内容,因为有人说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);

2 个答案:

答案 0 :(得分: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>

答案 1 :(得分:0)

没有看到整个代码,它可能有点棘手,但尝试这样的事情(确保将recipientField.val()传递给checkAddressFields()):

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