Ajax不会显示链接下拉列表第二个列表选项

Question

开始学习脚本。但无法搞清楚，如何调试我的问题。有2个链接的下拉列表。地区 - ＆gt;国家。但是，当我选择我想要的地区时，在国家/地区下拉菜单中，不显示任何选项。

我的后端代码。

public function selectCountry(){
    try
    {
        if(!empty($_POST["region"])) {

            $region=$_GET['region'];
            $stmt = $this->conn->prepare("SELECT * FROM countries ORDER BY country WHERE region_id='$region'");

            $stmt->execute();

            foreach($stmt as $country) { 
                echo "<option value='" . $country['country'] ."'>"  . $country['country'] . "</option>";        
            }

        return $stmt;   
        }
    }
    catch(PDOException $e)
    {
        echo $e->getMessage();
    }   
}

前面的剧本。

<script>
function getCountry(val) {
    $.ajax({
    type: "POST",
    url: "../../System/class.map.php",
    data:'region='+val,
    success: function(data){
        $("#country").html(data);
    }
    });
}
</script>

HTML方面：

<div class="control-group">
<label class="control-label" for="region">Region</label>
<div class="controls">
<select name="region" id="region" class="form-control" onChange="getCountry(this.value); "> <option value=''>Select Region<?php $map->selectRegion(); ?></option></select>  
</div>
</div>
<div class="control-group">
<label class="control-label" for="country">Country</label>
<div class="controls">
<select name="country" id="country" class="form-control"> <option value=''>Select Country<?php $map->selectCountry(); ?></option></select>  
</div>
</div>