javascript - 选择选项下拉菜单需要时间专门在 Chrome 中关闭

Question

我在单个网页上有两个选择选项按钮，但在不同的选项卡上。我想在更改任何一个按钮时更改另一个按钮的值，并将其分配给某些元素，例如示例代码中的 span 。所有事情都运行良好，但当我改变值(value)时，它只是需要时间来关闭下拉菜单。在 firefox 中没有问题

jsfiddle

我的 HTML 代码

<select class="select one" >
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select><br><br><br>
<select class="select two">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>
<br><br><br>
 <span class="value"></span>

JQuery

var lang =  $('select.one').val();
$('span.value').text(lang);

$('select.select').change(function(){
            lang = $(this).val();
            $('span.value').text(lang);
            if ($(this).hasClass('one')) {
                    $('.two').val($(this).val()).trigger('change'); 
            }
            else{
                $('.one').val($(this).val()).trigger('change'); 
                }

        });

提前致谢

Answer 1

fixed jsFiddle demo

这是因为您同时触发了更改。冷静下来，这就是你所需要的:

var lang = $('select.one').val();
$('span.value').text(lang);

$('select.select').change(function () {
  lang = this.value;
  $('span.value').text(lang);
  $('.select').val(lang);
});