php - 下拉选项在选择时会发生变化

Question

我正在尝试创建一个 2 下拉列表。当选择第一个下拉列表时，第二个下拉列表的值会发生变化。我似乎无法在第二个下拉列表中插入名称。这是我的代码

<script type='text/javascript'>
$(window).load(function(){
$("#category").change(function () {
    if ($(this).data('options') === undefined) {
        /*Taking an array of all options-2 and kind of embedding it on the select1*/
        $(this).data('options', $('#select2 option').clone());
    }
    var id = $(this).val();
    var options = $(this).data('options').filter('[value=' + id + ']');
    $('#select2').html(options);
    //alert(options);
});
});

</script>

<form action = '' method = 'POST'>
  <select name="select1" id="category">
        <option><--Destinations--></option>
        <?php
            $destination = mysql_query("SELECT * FROM destination");
            while ($row = mysql_fetch_assoc($destination))
            {
                $destid = $row['destination_id'];
                $destname = $row['destination_name'];
                echo"<option value=".$destname.">".$destname."</option>";
            }

        ?>
</select>

<select name="items" id="select2">
    <option><--Hotels--</option>
    <?php
        $hotel = mysql_query("SELECT * FROM hotel");
        while ($row = mysql_fetch_array($hotel))
        {
            $hotel_location = $row['hotel_location'];
            $hotel_name = $row['hotel_name'];
            echo"<option value=".$hotel_location.">".$hotel_name."</option>";
        }
    ?>
</select>
<input type = "submit" name="add"> 
</form> 



<?php
if(isset($_POST['select1'],$_POST['items']))
{
    $destination_name = $_POST['select1'];
    $hotel_name = $_POST['items'];
    echo $destination_name;
    //echo $destination_id;

}
?>

它已经输出酒店位置，但我似乎无法找到获取所选酒店名称的方法。请帮忙

Answer 1

尝试

   <script type='text/javascript'>
   $(window).load(function(){
   $("#category").change(function () {
       if ($(this).data('options') === undefined) {
       /*Taking an array of all options-2 and kind of embedding it on the select1*/
        $(this).data('options', $('#select2 option').clone());
   }
   var id = $(this).val();
   var options = $(this).data('options').filter('[value=' + id + ']');
   $('#select2').html(options);
   //alert(options);
   });
   });

   </script>

   <form action = '' method = 'POST'>
   <select name="select1" id="category">
    <option><--Destinations--></option>
    <?php
        $sql = "SELECT * FROM destination";
        $destination =  = $conn->Execute($sql);
        while ($row = $destination)
        {
            $destid = $row['destination_id'];
            $destname = $row['destination_name'];
            echo"<option value=".$destname.">".$destname."</option>";
        }

    ?>
   </select>

 <select name="items" id="select2">
 <option><--Hotels--</option>
 <?php
    $sql = "SELECT * FROM hotel";
    $hotel = $conn->Execute($sql);
    while ($row = $hotel)
    {
        $hotel_location = $row['hotel_location'];
        $hotel_name = $row['hotel_name'];
        echo"<option value=".$hotel_location.">".$hotel_name."</option>";
    }
?>