如何在ajax加载不同内容后刷新Select2下拉菜单？

我在下拉菜单组合中使用 Select2。我有一个“国家”菜单和一个“州/省”菜单。根据所选的国家/地区，“州/省”下拉菜单会更改内容。使用 ajax 从数据库中提取州/省，然后按以下方式显示：

$display_output = '<select style="width:350px;" tabindex="2" name="state" id="state" data-placeholder="Choose a Country..."> ';
$display_output .= '<option value="" selected>Select a State</option> ';

while ($state_details = $this->fetch_array($sql_select_states))
{
    $display_output .= '<option value="' . $state_details['id'] . '" ' . (($selected_value == $state_details['id']) ? 'selected' : ''). '>' . $state_details['s.name'] . '</option>';
}

$display_output .= '</select>';

目前为止，一切都好。所有省份都正确更改，但是当它最初加载时，Select2显示状态下拉列表的“未定义”，即使我将其设置为

data-placeholder="Choose a Country..."

我假设这可能是因为在加载时，选择的国家/地区是“美国”，并且它填充了州列表，但没有一个是默认或选择的。有没有其他方法可以定义默认值，使其不显示“未定义”？

另一个（但不太重要）的问题是，例如，当有人选择“美国”，然后选择“亚利桑那州”时，如果该人随后更改为“加拿大”作为国家，则“亚利桑那州”的州仍然存在，但是当打开下拉列表时，加拿大的省份是可选的。当有人选择另一个国家时，有没有办法将其暂时恢复为默认值，直到再次选择一个省？

我的加载代码目前只是：

<script>
$(document).ready(function() { $("#state").select2(); });
</script>