jquery - 如何更改 jQuery 中 select2 中的 2 个选择框之间的选定选项元素？

Question

我需要使用 jQuery 在两个 select2 之间更改选择。

例如:

<select id="fromCity" class="select2">
    <option value='THR' selected> Tehran </option>
    <option value='LON'> London </option>
</select>

还有

<select id="toCity" class="select2">
    <option value='THR'> Tehran </option>
    <option value='LON' selected> London </option>
</select>

现在，我需要在点击THR -> LON后更改为LON -> THR

在 jQuery 中:

$('i[data-change-airport]').on('click', function () {
    var fromCity = $('#fromCity').val();
    var toCity = $('#toCity').val();

    $('#fromCity').select2('val', toCity);
    $('#toCity').select2('val', fromCity);
})

但是这段代码不起作用。问题出在哪里？

Answer 1

$('.select2').on('change', function() {
  $('.select2').not(this).val($(this).val());
  $('.select2').not(this).val($(this).val());
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="fromCity" class="select2">
    <option value='THR' selected> Tehran </option>
    <option value='LON'> London </option>
</select> And

<select id="toCity" class="select2">
    <option value='THR'> Tehran </option>
    <option value='LON' selected> London </option>
</select>

试试这个方法