Javascript 包含select的div在附加到窗体后不工作

我有一个表格，我有下拉菜单来选择一个城市。我想在此表单中再添加一个下拉列表，以选择所选城市中的位置。我的表单代码如下所示

<s:form  role="form" name = "signUpForm" onsubmit="return validateSignupForm()" action = "signUp" method="post" namespace="/" theme="simple">
    <div class ="form-group">
        <label for= "city">City</label>
            <select list="cityList" onchange="getLoad()" class="form-control selectpicker"  name="city" id="city"   data-live-search="true" data-size="5">
             <option value="NA">--select a city--</option>  
             <option value="A"> A</option>
             <option value ="B">B</option>
             <option value ="C">C</option>
             <option value ="D">D</option>
          </select> 
    </div>
    <div id="parentLocationDiv"></div>
 </s:form>

---

现在，当我选择一个城市对应的位置下拉菜单是可见的形式，但当我选择任何选项，它不会被选中。有人能帮我吗

除了在没有匹配位置的情况下抛出错误外，您的代码似乎正常工作。您可以按如下方式修复它：

函数getLoad（）{ var parentDiv=document.getElementById（“parentLocationDiv”）； while（parentDiv.hasChildNodes（））{ parentDiv.removeChild（parentDiv.childNodes[0]）； } var cityName=document.getElementById（“城市”）.value | |“”； var target=document.getElementById（cityName.concat（“位置”）； 如果（！目标） 返回； var clone=target.cloneNode（true）； clone.getElementsByTagName（“选择”）.name=“位置”； clone.getElementsByTagName（“选择”）.id=“位置”； parentDiv.appendChild（克隆）； parentDiv.childNodes[0].style.display=“block”； }

.holder{
显示：无；
}

城市
--选择一个城市--
A.
B
C
D
1.
2.
1.
2.

<div class="form-group" id="ALocation">
  <select id="alocation" name="alocation">
     <option value="1">1</option>
     <option value="2">2</option>
  </select>
</div>
<div class="form-group" id="BLocation">
  <select id="blocation" name="blocation">
     <option value="1">1</option>
     <option value="2">2</option>
  </select>
</div>

  function getLoad(){

     var ParentDiv  =   document.getElementById("parentLocationDiv"); 

     while(ParentDiv.hasChildNodes())
     {
         ParentDiv.removeChild(ParentDiv.childNodes[0]);
     }
            var cityName = document.getElementById("city").value;

                if(ParentDiv.hasChildNodes())
                {   while(ParentDiv.hasChildNodes())
                    {   
                        ParentDiv.removeChild(Parentdiv.childNodes[0]);

                    }
                }
                debugger;
                var clone = document.getElementById(cityName.concat("Location")).cloneNode(true);
                ParentDiv.appendChild(clone);
                ParentDiv.childNodes[0].style.display="block";
                var newdiv = ParentDiv.childNodes[0];
                newdiv.getElementsByTagName("select").name="location";
                newdiv.getElementsByTagName("select").id="location";

      }