替换其他选择框的选择选项列表值

Question

<ul>
   <li>
      <select class="main">
         <option value="1" selected>One</option>
         <option value="2">Two</option>
         <option value="3">Three</option>
         <option value="4">Four</option>
         <option value="5">Five</option>
      </select>
   </li>
   <li>
      <select >
         <option value="1">One</option>
         <option value="2">Two</option>
         <option value="3">Three</option>
         <option value="4">Four</option>
         <option value="5">Five</option>
      </select>
   </li>
   <li>
      <select >
         <option value="1">One</option>
         <option value="2" selected >Two</option>
         <option
            value="3">Three</option>
         <option value="4">Four</option>
         <option
            value="5">Five</option>
      </select>
   </li>
</ul>
<li>
   <select class="main">
      <option value="1">One</option>
      <option value="2">Two</option>
      <option value="3">Three</option>
      <option value="4">Four</option>
      <option value="5">Five</option>
   </select>
</li>
<li>
   <select >
      <option value="1">One</option>
      <option value="2">Two</option>
      <option value="3">Three</option>
      <option value="4">Four</option>
      <option value="5">Five</option>
   </select>
</li>
<li>
   <select >
      <option value="1">One</option>
      <option value="2" selected >Two</option>
      <option
         value="3">Three</option>
      <option value="4">Four</option>
      <option
         value="5">Five</option>
   </select>
</li>
</ul>

在此代码中，当我在第一个选项中选择2时，所有先前选择1的选项值都应替换为1

Answer 1

您总是可以这样：

HTML

<select id="main">
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>

<select id="child">
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>

代码

$('#main').change(function() {
    $('#child').val(this.value)
})

Answer 2

$('.main').change(function(){
    var _choosed = $(this).find(':selected').val();
    if (_choosed == '2'){
        $(this).parent().parent().find('select:not(.main) option[value="1"]').prop('selected', true)
;
    }
});