我一个接一个地调用了 3 个 ajax 调用，它们调用了它们各自的 Web 服务。这些 Web 服务返回 parseJSON 对象。在所有 3 个 ajax 调用中，我使用这些 parseJSON 对象值填充下拉列表。但它只填充第一个和第三个列表，而不是第二个。那么问题是什么？
我的代码如下。
<script type="text/javascript">
$(document).ready(function () {
//For test
$ConUrl = 'http://mydomain.com/WebService.asmx/FetchCountry?callback=parseJSON?';
$StateUrl = 'http://mydomain.com/WebService.asmx/FetchState?callback=parseJSON?';
$CityUrl = 'http://mydomain.com/WebService.asmx/FetchCity?callback=parseJSON?';
populateCountries();
}); // ready end
function populateCountries() {
$.ajax({
type: 'GET',
url: $ConUrl,
processData: true,
data: {},
dataType: "jsonp",
jsonpCallback: 'parseJSON',
success: function (data) {
var html = '<option value="0">All Regions</option>';
var len = data.length;
for (var i = 0; i < len; i++) {
html += '<option value="' + data[i] + '">' + data[i] + '</option>';
}
$('select#ddlCountry').append(html);
populateStates();
},
error: function (data) { }
});
}
function populateStates() {
$.ajax({
type: 'GET',
url: $StateUrl,
processData: true,
data: {},
dataType: "jsonp",
jsonpCallback: 'parseJSON',
success: function (data1) {
var html1 = '<option value="0">All States</option>';
var len1 = data1.length;
for (var j = 0; j < len1; j++) {
html1 += '<option value="' + data1[j] + '">' + data1[j] + '</option>';
}
$('select#ddlState').append(html1);
populateCities();
},
error: function (data1) { }
});
}
function populateCities() {
$.ajax({
type: 'GET',
url: $CityUrl,
processData: true,
data: {},
dataType: "jsonp",
jsonpCallback: 'parseJSON',
success: function (data2) {
var html2 = '<option value="0">All Cities</option>';
var len2 = data2.length;
for (var k = 0; k < len2; k++) {
html2 += '<option value="' + data2[k] + '">' + data2[k] + '</option>';
}
$('select#ddlCity').append(html2);
},
error: function (data2) { }
});
}
</script>