如何通过jQuery控制输入类型下拉菜单选择选项菜单

Question

我正在创建一个网站。在此网站上，有一个表格。我以这种形式添加了3个下拉菜单，如下所示。现在，我想当有人从“成人”菜单中选择5号时，我想在“婴儿”菜单中显示5号。而且我也不想保留“成人+儿童” =9。然后，如果该总数小于9，我想在婴儿菜单中显示该额外数字。我的意思是这样，

Adults + Children = 9
Adults = 5 and infants = 5
But , Adults + Children = 8
Adults = 5 , Children = 3 , it means there is still 1. 
Now I want to show that 1 with infants , 1 + 5 = 6.

在以下代码段中查找

$(document).ready(function() {

  var adults = parseFloat($('#adults').val());
  var children = parseFloat($('#children').val());
  var infants = $('#infants').val();
  var Total = adults + children;
  //$("#errorModal").html(Total);

  var totalAdultChild = 9;
  $('#adults').change(function() {
    var adultValue = this.value;
    if (this.value > 8) {
      $("#children").prop('disabled', true);

    } else {
      $("#children").prop('disabled', false);

      $('#children option').each(function(index, element) {
        if ((totalAdultChild - adultValue) < this.value)
          $(this).hide();
        else
          $(this).show();
      });

      $('#infants option').each(function(index, element) {
        if (adultValue < this.value)
          $(this).hide();
        else
          $(this).show();
      });

    }
  });


  //alert(Total);

});

<form class="form-horizontal" method="POST" action="#" enctype="multipart/form-data" id="signupForm">

  <div class="col-md-4 col-sm-12 hero-feature">
    <!-- Start Of The Col Class -->
    Adults :
    <select name="adults" class="form-control" id="adults">
      <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>
      <option value="6">6</option>
      <option value="7">7</option>
      <option value="8">8</option>
      <option value="9">9</option>
    </select> <br>
  </div>

  <div class="col-md-4 col-sm-12 hero-feature">
    <!-- Start Of The Col Class -->
    Children :
    <select name="children" class="form-control" id="children">
      <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>
      <option value="6">6</option>
      <option value="7">7</option>
      <option value="8">8</option>
      <option value="9">9</option>
    </select> <br>

  </div>

<div class="col-md-4 col-sm-12 hero-feature">
<!-- Start Of The Col Class -->
Children :
<select name="infants" class="form-control" id="infants">
  <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>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
</select> <br>

  </div>

  <a href="#" id="ghsubmitbtn" class="btn btn-success">Search Flight Data</a>

</form>

没有答案??

Answer 1

以下是根据您的解释的解决方案：

CREATE SEQUENCE hibernate_sequence
start with 1
increment by 1
minvalue your_min_value
maxvalue your_max_value
cycle; 

演示：https://codepen.io/creativedev/pen/aKaJxW