您的位置:首页 > 其它

简单的两级联动ajax加载省市

2013-11-04 15:42 190 查看
//新添加修改的时候绑定省市

jquery Code:

//ajax绑定省s
$(function(){
var prov = '${tour.prov}';
$.ajax({
url: "./listProv.jspx",
type: 'POST',
dataType: 'JSON',
timeout: 5000,
error: function() { alert('加载省列表失败!'); },
success: function(msg) {
$("#province").empty();
$.each(eval(msg), function(i, item) {
if(item.prov==prov){
$("<option value='" + item.prov + "' selected = 'selected'>" + item.prov + "</option>").appendTo($("#province"));
}else{
$("<option value='" + item.prov + "'>" + item.prov + "</option>").appendTo($("#province"));
}
});
loadCity($("#province").val());
}
});
$("#province").change(function() {
loadCity($("#province").val());
});

function loadCity(parentid) {
var city = '${tour.city}';

$.ajax({
url: './listCity.jspx?prov='+ parentid,
type: 'POST',
dataType: 'JSON',
timeout: 5000,
error: function() { alert('加载城市列表失败!'); },
success: function(msg) {
$("#city").empty();
$.each(eval(msg), function(i, item) {
if(item.city ==city){
$("<option value='" + item.city + "' selected = 'selected'>" + item.city + "</option>").appendTo($("#city"));
}else{
$("<option value='" + item.city + "'>" + item.city + "</option>").appendTo($("#city"));
}

});
}
});
}
})

如果get方式出现中文乱码的时候:

那么ajax【get方式】附带参数的时候需要加个函数:encodeURIComponent

即:

url: './listCity.jspx?prov='+ encodeURIComponent(parentid),


说明:

encodeURIComponent方法在编码单个URIComponent(指请求参数)应当是最常用的,它可以讲参数中的中文、特殊字符进行转义,而不会影响整个URL。

具体详情请看:

CSDN发帖关于ajax  get方式乱码:

http://bbs.csdn.net/topics/310141608

 对函数URIComponent()的具体说明:

http://www.cnblogs.com/qiantuwuliang/archive/2009/07/19/1526687.html
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: