javascript - 多选框中的值在选择时消失

Question

所以我有一个 2 个多选框(一个用于楼层，一个用于房间)。房间中的值取决于楼层。如果您选择楼层:001，房间中的所有值将从 1 开始，如果您选择楼层:002，房间中的所有值将从 2 开始，依此类推。但是当我在 Room 中选择值时，所有值都会消失，这是我的脚本:

<script type="text/javascript">
$(document).ready(

        function()
        {
              var selectArr = []; 
              $("select").change(function(){
                  var arr = $(this).val()
                   selectArr.push(arr);
                   console.log(arr)
                   populateRooms();
                   clearArray();
                });


              function clearArray() {
                  return selectArr = []
                }     

        function populateRooms() {
        $.ajax({

                type: "GET",
                url: "/hms/shifts/" + selectArr,
                success: function (response) {
                 $('#_rooms_id').empty();
                    var myObject = eval('(' + response + ')');
                    for (i in myObject)
                    {
                        $('#_rooms_id').append(
                                $('<option></option>', 
                                { 
                                    value: myObject[i]["id"],
                                    text: myObject[i]["roomNumber"]
                                }
                                )
                             );
                    }

                },
               error: function (e){
                   alert("Error" + e)
               }
           });
        }

        });

  </script>

我认为这是因为 .empty() 但如果我删除 room 中的所有值都会显示，将不会有过滤器。我希望有一个人可以帮助我。新手在这里。谢谢。

Answer 1

我猜你应该只在楼层选择中添加事件来填充房间选择

此代码将 onChange 事件添加到代码中的所有下拉列表中:

 $("select").change(function(){
              var arr = $(this).val()
               selectArr.push(arr);
               console.log(arr)
               populateRooms();
               clearArray();
            });

更改为:

$("#floors-dropdownId").change(function(){
              var arr = $(this).val()
               selectArr.push(arr);
               console.log(arr)
               populateRooms();
               clearArray();
            });