当我选择另一个选择标签HTML<；选择> - How to automatically change the value list of option of select tag when i select the certain option of another select tag HTML <select>

How to automatically change the value list of option of select tag when i select the certain option of another select tag HTML <select>

本文关键字：选择 lt gt 标签另一个 HTML | 更新日期: 2023-09-27

<select>
  <option>america</option>
  <option>rusia</option>
  <option>china</option>
</select>
<select>   <!--here the second select tag which has so many option value-->
  <option>list1</option>
  <option>list2</option>
  <option>list3</option>
</select>

当我选择第一个选择时，如何动态更改第二个选择标记的值？

例如，如果我选择美国，第二个选择选项列表将显示华盛顿、纽约等，但当我选择白俄罗斯时，它将显示莫斯科等。

您可以使用附加到所有<select>元素的change事件，使用.not() 将每个select元素的selectedIndex设置为当前change event.target元素selectedIndex，.each()不包括当前元素this

var select = $("select");
select.change(function(e) {
  select.not(this).each(function() {
    this.selectedIndex = e.target.selectedIndex
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option>america</option>
  <option>rusia</option>
  <option>china</option>
</select>
<select>   <!--here the second select tag which has so many option value-->
  <option>list1</option>
  <option>list2</option>
  <option>list3</option>
</select>