jQuery错误从本地JSON数据中提取依赖的下拉列表?

时间:2019-01-03 17:19:49

标签: jquery json

当我选择国家/地区时,我试图填充选择列表,然后显示与该国家/地区对应的州,但是当我尝试获取与国家/地区对应的城市时,则显示我未定义。 json文件在这里 country.json,state.json和city.json citiesJSONcountriesJSONindianStatesJSON

$(function() {
  var countryOptions;
  var stateOptions;
  var districtOptions;
  $.getJSON('countries.json', function(result) {
    $.each(result, function(i, country) {
 
      countryOptions += "<option value='" +
        country.code +
        "'>" +
        country.name +
        "</option>";
    });
    $('#country').html(countryOptions);
  });
  $("#country").change(function() {
    if ($(this).val() == "IN") {
      $.getJSON('indianStates.json', function(result) {
        $.each(result, function(stateCode, stateName) {
      
          stateOptions += "<option value='" +
            stateCode +
            "'>" +
            stateName +
            "</option>";
        });
        $('#state').html(stateOptions);
      });
    }
  });

  $("#state").change(function() {
    if ($(this).val() == "MH") {
      $.getJSON('cities.json', function(result) {
        $.each(result, function(i, district) {
     
          districtOptions += "<option value='" +
            district.name +
            "'>" +
            district.name +
            "</option>";
        });
        $('#district').html(districtOptions);
      });
    }
  });

});
<body>
  Country:
  <select id="country">
  </select>
  State:
  <select id="state">
  </select>
  District:
  <select id="district">
  </select>
  <script src="custom.js"></script>
</body>

0 个答案:

没有答案