使用onchange事件通过Javascript生成的列表的HTML表单 - 未按预期工作

我有一个带有#List1、#Text1和#List2的HTML表单。 #List1是通过 PHP 从 MySQL 通过 JSON 生成的。 #Text1对用户输入的更改。 每次用户更改#Text1时，也应该通过MySQL的JSON生成#List2，同时使用#List1中选择的值和#Text1的内容。

表单中的数据在 PHP 中进一步用于通过对 MySQL 的查询生成包含数据的表。

我尝试使用 onchange() 事件生成#List2，但它不起作用 - #List2 在用户输入 #Text1 后仍为空，尽管执行了 onchange() 函数。

.HTML

<div class="input_frm">
  <form method="post" action="<?php print data_clean($_SERVER["PHP_SELF"]);?>">
    <table class="input_tbl">
       <tr>
          <td class="a">Select county</td>
          <td class="b"><select id="selJudet" name="Alfa" onchange="judetChg()"></select></td>
          <td class="c"><input class="button_face" type="submit" value="Submit"></td>
          </tr>
       <tr>
          <td class="a">Search zone as</td>
          <td class="b"><input type="text" id="selText" name="Beta" maxlength="35" placeholder="Wildcard string" onchange="textChg()" /></td>
          <td class="c"></td>
          </tr>
       <tr>
          <td class="a">Select zone</td>
          <td class="b"><select id="selZona" name="Gamma" onchange="zonaChg()"></select></td>
          <td class="c"></td>
          </tr>
       </table>
    </form>
  </div>

JavaScript

$(document).ready(function()
   {
   $.getJSON("/scripts/033A_GetJudet.php", success = function(data)
      {
      var str_options = "";
      for (var i=0; i < data.length; i++)
          {
          str_options += "<option value='" + data[i] + "'>" + data[i] + "</option>";
          }
      $("#selJudet").append(str_options);
      var selOption = document.getElementById("selJudet");
      selOption.selectedIndex = localStorage.getItem("selJudIndex") || 0;
      document.getElementById("selJudet").selectedIndex = selOption.selectedIndex;
      });
});

function judetChg() 
{
var selOption = document.getElementById("selJudet");
localStorage.setItem("selJudIndex", selOption.selectedIndex);
}
function textChg() 
{
var selTextValue = document.getElementById("selText").value;
localStorage.setItem("selTextValue", selTextValue);
var selJudet = localStorage.getItem("selJudIndex");
//alert(selJudet);
var str_http = "/scripts/033B_GetJudetWildcdZona.php?judet=" + selJudet + "&textwildcd=" + selTextValue;
//alert(str_http);
$.getJSON(str_http, success = function(data)
    {
    var str_options = "";
    for (var i=0; i < data.length; i++)
        {
        str_options += "<option value='" + data[i] + "'>" + data[i] + "</option>";
        }
    $("#selZona").html("");
    $("#selZona").append(str_options);
    });
}
function zonaChg() 
{
var selOption = document.getElementById("selZona");
localStorage.setItem("selZonaIndex", selOption.selectedIndex);
}