Jquery html()方法不起作用
Jquery html()方法不起作用
提问于 2012-02-24 01:44:03
下面是我的代码：
$(function () {
var region = $('#region');
var city = $('#city');
var pickedRegionId = region.find(':selected').val();
var options;
if (pickedRegionId === '') {
console.log('region is empty, html() and disable');
city.html('');
city.attr('disabled', true);
}
region.change(function(){
console.log('region is changed');
pickedRegionId = $(this).val();
if (pickedRegionId !== '') {
city.html('');
console.log('loading cities');
getCities(pickedRegionId);
}
});
function getCities (regionId) {
city.attr('disabled', true);
city.html('<option>Loading...</option>');
$.get(
'/ajax/get_cities',
'region_id='+regionId,
function (responce) {
if (responce.result === 'success') {
$(responce.cities).each(function(){
options += '<option value="'+$(this).attr('id')+'">'+$(this).attr('city')+'</option>';
});
city.html(options);
city.attr('disabled', false);
}
}, 'json'
);
}
});当页面加载正常时，我选择一些区域并选择用ajax数据填充的城市。但当我选择另一个地区时，城市选择中的数据只是使用较新的数据进行扩展。
所以问题是我有来自两个地区的城市(新的和旧的)。无论我选择另一个区域多少次，它只是将新数据添加到城市选择。在代码中，一切看起来都很好，在区域更改时，我放入了.html('')，所以在插入收到的值之前，它应该是空的。但我找不出bug是什么。
Stack Overflow用户
发布于 2012-02-24 01:49:09
您必须首先清空变量选项。您只是将新的城市添加到选项变量中。
最简单的解决方案是将选项变量移到getCities函数中，如下所示：
function getCities (regionId) {
var options = "";
city.attr('disabled', true);
city.html('<option>Loading...</option>');
$.get(
'/ajax/get_cities',
'region_id='+regionId,
function (responce) {
if (responce.result === 'success') {
$(responce.cities).each(function(){
options += '<option value="'+$(this).attr('id')+'">'+$(this).attr('city')+'</option>';
});
city.html(options);
city.attr('disabled', false);
}
}, 'json'
);
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/9418282
复制相关文章
相似问题
腾讯云开发者
