javascript - 两个选定的输入具有相同的值

Question

我尝试过这种方法来创建一个系统，让用户选择他们的愿望排名，当从用户选择的两个选择输入中查找时，我陷入了jquery，例如，这就是我所做的。

现在，如果当前排名的用户在第二次选择时选择银 3，我想阻止用户选择银 2、银 1 等...

    $('select').change(function(){
      var sum = 0;
      $('select :selected').each(function() {
          sum += Number($(this).val());
      });
           $("#total").html(sum);
           $('input[name=amount]').val(sum);
  });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>Your RANK</p>
    <select name='anch1'>
     <option value='10'>Silver 1</option>
     <option value='20'>Silver 2</option>
     <option value='30'>Silver 3</option>
     <option value='40'>Silver 4</option>
     <option value='50'>Silver Elite</option>
     <option value='60'>Silver Elite Master</option>
     <option value='70'>Gold Nova 1</option>
     <option value='80'>Gold Nova 2</option>
     <option value='90'>Gold Nova 3</option>
     <option value='100'>Gold Nova Master</option>
     <option value='110'>Master Guardian</option>
     <option value='120'>Master Guardian 2</option>
     <option value='130'>Master Guardian Elite</option>
     <option value="140">Distinguished Master Guardian</option>
     <option value="150">Legendary Eagle</option>
     <option value="160">Legendary Eagle Master</option>
     <option value="170">Supreme master First Class</option>
    </select>
<p>Desire Rank</p>
    <select name='anch2'>
      <option value='10'>Silver 1</option>
      <option value='20'>Silver 2</option>
      <option value='30'>Silver 3</option>
      <option value='40'>Silver 4</option>
      <option value='50'>Silver Elite</option>
      <option value='60'>Silver Elite Master</option>
      <option value='70'>Gold Nova 1</option>
      <option value='80'>Gold Nova 2</option>
      <option value='90'>Gold Nova 3</option>
      <option value='100'>Gold Nova Master</option>
      <option value='110'>Master Guardian</option>
      <option value='120'>Master Guardian 2</option>
      <option value='130'>Master Guardian Elite</option>
      <option value="140">Distinguished Master Guardian</option>
      <option value="150">Legendary Eagle</option>
      <option value="160">Legendary Eagle Master</option>
      <option value="170">Supreme master First Class</option>
      <option value="180">The Global Elite</option>
    </select>
    
      <p id="total">total: </p>

Answer 1

我认为您正在寻找类似的东西，但它可能有点偏离您的需要，但请尝试一下:

$('select[name^="anch"]').change(function() {
  var sum = 0;
  $('select[name^="anch"] :selected').each(function() {
    sum += Number($(this).val());
  });
  $("#total").html(sum);
  $('input[name=amount]').val(sum);

  var n1 = $('select[name="anch1"]').val();

  if (n1 != 10) {
    $('select[name="anch2"] option').removeAttr('disabled');
    var o2 =  $('select[name="anch2"] option').filter(function() {
      return this.value <= n1
    });
    $(o2).attr('disabled', 'disabled');
  }
});

工作演示

$('select[name^="anch"]').change(function() {
  var sum = 0;
  $('select[name^="anch"] :selected').each(function() {
    sum += Number($(this).val());
  });
  $("#total").html(sum);
  $('input[name=amount]').val(sum);

  var n1 = $('select[name="anch1"]').val();

  if (n1 != 10) {
    $('select[name="anch2"] option').removeAttr('disabled');
    var o2 =  $('select[name="anch2"] option').filter(function() {
      return this.value <= n1
    });
    $(o2).attr('disabled', 'disabled');
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>Your RANK</p>
<select name='anch1'>
  <option value='10'>Silver 1</option>
  <option value='20'>Silver 2</option>
  <option value='30'>Silver 3</option>
  <option value='40'>Silver 4</option>
  <option value='50'>Silver Elite</option>
  <option value='60'>Silver Elite Master</option>
  <option value='70'>Gold Nova 1</option>
  <option value='80'>Gold Nova 2</option>
  <option value='90'>Gold Nova 3</option>
  <option value='100'>Gold Nova Master</option>
  <option value='110'>Master Guardian</option>
  <option value='120'>Master Guardian 2</option>
  <option value='130'>Master Guardian Elite</option>
  <option value="140">Distinguished Master Guardian</option>
  <option value="150">Legendary Eagle</option>
  <option value="160">Legendary Eagle Master</option>
  <option value="170">Supreme master First Class</option>
</select>
<p>Desire Rank</p>
<select name='anch2'>
  <option value='10'>Silver 1</option>
  <option value='20'>Silver 2</option>
  <option value='30'>Silver 3</option>
  <option value='40'>Silver 4</option>
  <option value='50'>Silver Elite</option>
  <option value='60'>Silver Elite Master</option>
  <option value='70'>Gold Nova 1</option>
  <option value='80'>Gold Nova 2</option>
  <option value='90'>Gold Nova 3</option>
  <option value='100'>Gold Nova Master</option>
  <option value='110'>Master Guardian</option>
  <option value='120'>Master Guardian 2</option>
  <option value='130'>Master Guardian Elite</option>
  <option value="140">Distinguished Master Guardian</option>
  <option value="150">Legendary Eagle</option>
  <option value="160">Legendary Eagle Master</option>
  <option value="170">Supreme master First Class</option>
  <option value="180">The Global Elite</option>
</select>

<p id="total">total: </p>