JQuery,同步选择选项

JQuery , syncronized selection option

本文关键字:选项 选择 同步 JQuery      更新时间:2023-09-26

我必须在我的jsp中标记两个相同的选择选项。

我希望任何时候我链接一个,第二个(在底部)也会改变。

<select class="groups">
    <option class='America' value='America'>America</option>
    <option class='Europe' value='Europe'>Europe</option>
    <option class='Asia' value='Asia'>Asia</option>
<select>
<select class="groups">
    <option class='America' value='America'>America</option>
    <option class='Europe' value='Europe'>Europe</option>
    <option class='Asia' value='Asia'>Asia</option>
<select>

因此,例如,每当我选择欧洲(或任何其他),我希望我所有的选择得到更新与相同的值

不使用jquery:

document.getElementsByClassName("groups").forEach(function(element){
  element.onchange = function(event) {
    document.getElementsByClassName("groups").forEach(function(x){
    x.value = event.target.value;
    });
  }
});
与jquery:

$('.groups').onchange = function(e){
  $('.groups').forEach(function(x){
  x.val(e.currentTarget().val)
  });
}