javascript - 如何从使用 Ajax 填充的下拉列表中更改 selectedIndex？

Question

我有 3 个下拉列表，其中包含某个国家/地区的区域、位置、子位置。当有人从第一个列表中选择某些内容后，我使用 Ajax 填充位置和子位置列表。

现在讨论我的问题:

我使用LocalStorage，因此当刷新页面时，我可以保留这些值并使用最后选择的值自动重新填充列表。

列表已成功填充，但无法更改selectedIndex(选择“选择城镇/选择子区域”)。

我尝试了在 stackoverflow 中找到的关于如何更改 selectedIndex 的每一种方法，但没有一个有效，也没有一个给我带来错误。所以我可以假设 ajax 有问题吗？像js这样的东西改变了selectedIndex，但是ajax调用将其重新更改回来，即使ajax被调用早于first。可能是这样的？

jQuery:

jQuery(document).ready(function(){
 if(localStorage) {
  if(localStorage.regions) {
  jQuery('#region_h').val(localStorage.regions);
  alert(localStorage.regions);
  getlocations_main(localStorage.regions); //ajax call for locations
  }
  if(localStorage.locations) {
    jQuery('#location_h').val(localStorage.locations);
    jQuery('#location_h option').eq(this.selectedIndex).prop('selected',true);
    alert(localStorage.locations);
    getsublocations_main(localStorage.locations); //ajax call for subloc
  }
  if(localStorage.subloc){
    jQuery('#subloc_h option').eq(this.selectedIndex).prop('selected',true);
  }

}
});

HTML:

<div class="row rowInput_spiti360">
 <div class="ie_fix_select_spiti360" >
  <div id="location_add_yo" class="mainselection" >
   <select class=" searchcategory" name="location_h" id="location_h" onchange="getsublocations_main(this.options[this.selectedIndex].value)">
    <option selected="selected" value="-1">Select a Town:</option>
   </select>
  </div>
 </div>
</div>  

<div class="row rowInput_spiti360">
 <div class="ie_fix_select_spiti360" >
  <div id="sublocation_add_yo"  class="mainselection" >
   <select id="subloc"  name="subloc" class=" searchcategory">
    <option selected="selected" value="-1">Select a sublocation:</option>
   </select>
  </div>
 </div>
</div> 

Answer 1

问题是this.selectedIndex，这里this指的是window而不是html元素