我们如何通过JQuery创建另一个带有一些选项的选择框

How can we create the another select box with some options through JQuery

本文关键字：选项 选择 何通过 JQuery 创建 另一个 我们      更新时间：2023-09-26

我想从选择框值创建另一个选择框。通过Jquery。

我们已经应用了这些代码，但目前不起作用。

<script src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script>
  $(document).ready(function () {
    var rooms = $("#rooms");
    var ROOMS = rooms.val() ;
    var max_adults_a = 3;
    var min_adults_a = 2;
    var max_adults = max_adults_a; 
    var min_adults = min_adults_a;
    var num = min_adults * ROOMS;
    ROOMS.change(function() {
      while (num <= max_adults_a * ROOMS) {
        $('#person').append($('<option></option>').val(num).html(num)
      )};
    });
 });
</script>
</head>
<body>
  <h1>Populating Select Boxes</h1>
  Category:
  <select name="rooms" id="rooms">
     <option Selected value="">Select</option>
     <option value="1">1</option>
     <option value="2">2</option>
     <option value="3">3</option>
  </select>
  person
  <select name="person" id="person">
  </select>
</body>

我们有两个选择框，一个用于房间，另一个用于人员。我们有一个房间列表，但我们必须根据房间大小更新人员，如果我们的房间类型为"3"，则该房间允许人员为6,7,8,9。

"人员"选项将相应更改。请为我提供合适的解决方案谢谢棒

$(document).ready(function () {
    var max_adults = 3; 
    var min_adults = 2;
    $('#rooms').change(function(){
        var room_num = $(this).val();
        var options = '';
        for (var i = min_adults * room_num; i <= max_adults * room_num; i++) {
            options += '<option value="'+i+'">'+i+'</option>'
        }
        $('#person').html(options);
    });
    $('#rooms').change();
});

在jsfidd.net 上

<head>
  <script src="http://code.jquery.com/jquery-1.5.min.js"></script>
  <script>
       $(document).ready(function () {
         var rooms = $("#rooms");
         var ROOMS = rooms.val() ;
         var max_adults_a = 3;
         var min_adults_a = 2;
         var max_adults = max_adults_a; 
         var min_adults = min_adults_a;
         $("#rooms").change(function() {
            $('#person').html("");
           var selectedRoom = parseInt($("#rooms option:selected").val(), 10)
           var num = min_adults * selectedRoom ;
           while (num <= max_adults_a * selectedRoom ) {
             $('#person').append($('<option></option>').val(num).html(num));
             num++;
           }
        });
     });
  </script>    
</head>
<body>
  <h1>Populating Select Boxes</h1>
  Category:
  <select name="rooms" id="rooms">
     <option Selected value="">Select</option>
     <option value="1">1</option>
     <option value="2">2</option>
     <option value="3">3</option>
  </select>
  person
  <select name="person" id="person">
  </select>
</body>
相关文章：