javascript - 当 <option> 来自使用 php mysqli_query 的 sql 时，onchange 不会触发

Question

我想放置一个下拉框，其中包含数据库中的国家/地区。 第二个下拉框应填充第一个下拉框的状态。 (我已经在“添加位置功能”上使用硬编码 HTML 完成了此操作，但现在这是搜索功能。)

<select name="COUNTRY" onchange="GetState();" class="VASELECT" style="WIDTH: 200PX;">

<?php 
$sql = mysqli_query($conn, 'SELECT DISTINCT country FROM t1 where country != ""');
while ($row = $sql->fetch_assoc()){

echo "<option value=\">". $row['country']."\">" . $row['country'] . "</option>";
}
?>
</select>

<select name="STATE" onchange="GetCity();" class="VASELECT">
<option value=""></option>
<option value="" selected="selected"></option></select>

它执行查询没有任何问题。第一个下拉框显示数据库中的国家/地区，但它无法检测到 onchange 函数，第二个下拉框没有任何内容可显示。 GetState() 应该可以工作。我不知道为什么。 JavaScript 代码很长，所以我只粘贴其中的一部分

<script language="JavaScript" type="text/javascript"> //get state inside

function GetState() {
    document.OPTIONS.CITY.length = 1;
    document.OPTIONS.CITY.options[0].text = "";
    document.OPTIONS.CITY.options[0].value = "";
    document.OPTIONS.STATE.length = 1;
    document.OPTIONS.STATE.options[0].text = "";
    document.OPTIONS.STATE.options[0].value = "";       

    if (document.OPTIONS.COUNTRY.value == "United States") {

        document.OPTIONS.STATE.length = 53;

            document.OPTIONS.STATE.options[1].text = "Alabama";
            document.OPTIONS.STATE.options[1].value = "AL";

            document.OPTIONS.STATE.options[2].text = "Alaska";
            document.OPTIONS.STATE.options[2].value = "AK";

               }

      }
//extends up to 3thousand lines of code (it contains all countries in the world. LOL)
</script>

Answer 1

错误可能出在 HTML 本身中。看一下这一行:

echo "<option value=\">". $row['country']."\">" . $row['country'] . "</option>";

这应该是:

echo "<option value=\"". $row['country']."\">" . $row['country'] . "</option>";

我注意到的另一件事是你没有:

<select name="STATE" onchange="GetCity();" class="VASELECT">

在 while 循环之上