Php 带有ajax代码的selectbox

我有两个选择框

1.区域ID

2.cityID

当用户在第一个选择框中选择区域时，第二个选择框将自动更改，并仅显示包含所选区域的城市

这很好，除非我从数据库加载数据或用户提交表单。在这些情况下，不会选择正确的城市-指针始终位于第一个选项（第一个城市）上

我需要改变什么

<p><label>AREA</label> 
    <select name='areaID' id='areaID'>
        <?PHP
        $query = mysql_query("SELECT * FROM `areas` ORDER BY id ASC "); 
        while($index = mysql_fetch_array($query)) 
        {
            $db_area_id = $index['id'];
            $db_area_name = $index['name'];
            if ($db_area_id == $userDetails['areaID'])
                echo "<option value='$db_area_id' selected>$db_area_name</option>";         
            else    
                echo "<option value='$db_area_id'>$db_area_name</option>";
        }
        ?>
    </select><span>*</span>
</p>

<p><label>CITY</label>
    <select id='cityID' name='cityID'>  </select>
</p>


<script>

<?PHP if ($_POST) { ?>
    $(document).ready(function(){
        $('#areaID').filter(function(){
            var areaID=$('#areaID').val();
            var cityID=<?PHP echo $userDetails['cityID'] ?>;
            $('#cityID').load('ajax/getCities.php?areaID=' + areaID+'&cityID=' + cityID);
            return false;
        });
    }); 
<?PHP }else { ?>

$(function () {
    function updateCitySelectBox() {
        var areaID = $('#areaID').val();
        $('#cityID').load('ajax/getCities.php?areaID=' + areaID);

        return false;
    }

    updateCitySelectBox();
    $('#areaID').change(updateCitySelectBox);
});
<?PHP } ?>

</script>

区域
$（文档）.ready（函数（）{
$（'#areaID'）.filter（函数（）{
var areaID=$（'#areaID'）.val（）；
var cityID=；
$（'#cityID'）.load（'ajax/getCities.php？areaID='+areaID+'&cityID='+cityID）；
返回false；
});
}); 
$（函数（）{
函数updateCitySelectBox（）{
var areaID=$（'#areaID'）.val（）；
$（'#cityID'）.load（'ajax/getCities.php？areaID='+areaID）；
返回false；
}
updateCitySelectBox（）；
$（“#areaID”）.change（updateCitySelectBox）；
});

getCities.php：

<?PHP

    $areaID = (int) $_GET['areaID'];


    $second_option = "";

    $query2 = mysql_query("SELECT * FROM `cities` WHERE area_id = $areaID ORDER BY id ASC");
    while($index = mysql_fetch_array($query2)) 
    {
        $id = $index['id'];
        $name  = $index['name'];

        $name = iconv('windows-1255', 'UTF-8', $name);

        $second_option .= "<option value='$id'>$name</option>";

    }

    echo $second_option;

//  exit; 

?>

更改此选项：

<p><label>CITY</label>
    <select id='cityID' name='cityID'>  </select>
</p>

城市


为此：

<p><label>CITY</label>
    <select id='cityID' name='cityID'>
    <?php
    if (isset($userDetails['areaID']))
    {
        $query = mysql_query("SELECT * FROM `cities` WHERE area_id = {$userDetails['areaID']} ORDER BY id ASC "); 
        while($index = mysql_fetch_array($query)) 
        {
            $db_city_id = $index['id'];
            $db_city_name = $index['name'];
            if (isset($userDetails['cityID']) && $db_city_id == $userDetails['cityID'])
                echo "<option value='$db_city_id' selected>$db_city_name</option>";         
            else    
                echo "<option value='$db_city_id'>$db_city_name</option>";
        }
    }
    else
    {
        echo '<option value="0">Select Area...</option>';
    }
    ?>
    </select>
</p>

城市
试着这样做：

$(".country").change(function()
{
var id=$(this).val();
var dataString = 'id='+ id;

$.ajax
({
type: "POST",
url: "ajax_city.php",
data: dataString,
cache: false,
success: function(html)
{
$(".city").html(html);
} 
});

});

.country和.city都是选择下拉列表，ajax_city.php获取所有城市并输出html。
来吧……这不是解决问题的正确方法。。。和-如果用户更改区域，脚本会发生什么变化？城市选择框是否会更改？我想不是……是的！这是正确的方法！！根据您的代码，当用户更改区域选择时，将调用方法updateCitySelectBox。