Question

ajax如何让下拉框联动

连接数据库，从数据库中查询数据。比如说点击江苏 第二个下拉框就会显示江苏省的城市。求大神给予代码支援，要求链接数据库的那种 我后台是PHP 通过ajax方式。求大神给予代码
代码代码只需要一个通过ajax实现二级省市联动的 帮忙写一下吧大神们

Answer 1

//定义省份、城市、地区
var ProvinceName = ""; var CityName = ""; var diqu = "";
if (request('id') != null) {
$.post("../../ashx/SelectByid.ashx", { id: request('id') }, function (data) {
ProvinceName = data.split("_")[5].split(' ')[0];
CityName = data.split("_")[5].split(' ')[1];
diqu = data.split("_")[5].split(' ')[2];
});
}
//绑定省份
$.get("../../ashx/addresscontrolHandler.ashx?action=" + "provincelist", function (datalist) {
var json = eval(datalist);
$("#Province").empty();
$.each(json, function (i, item) {
if (request('id') != null) {
if (item["ProvinceName"] == ProvinceName) {
$("<option selected='selected'></option>").val(item["ProvinceID"]).text(ProvinceName).appendTo($("#Province"));
}
else {
$("<option></option>").val(item["ProvinceID"]).text(item["ProvinceName"]).appendTo($("#Province"));
}
}
else {
if (item["ProvinceName"] == "请选择") {
$("<option selected='selected'></option>").val(item["ProvinceID"]).text(item["ProvinceName"]).appendTo($("#Province"));
}
else {
$("<option></option>").val(item["ProvinceID"]).text(item["ProvinceName"]).appendTo($("#Province"));
}
}
});

//绑定城市
$.get("../../ashx/addresscontrolHandler.ashx", { "action": "citylist", "province": $("#Province").val() }, function (citydata) {
var cityjson = eval(citydata);
$("#City").empty();
$.each(cityjson, function (i, item) {

if (request('id') != null) {
if (item["CityName"] == CityName) {
$("<option selected='selected'></option>").val(item["CityID"]).text(CityName).appendTo($("#City"));
}
else {
$("<option></option>").val(item["CityID"]).text(item["CityName"]).appendTo($("#City"));
}
}
else {
if (item["CityName"] == "上海市") {
$("<option selected='selected'></option>").val(item["CityID"]).text(item["CityName"]).appendTo($("#City"));
}
else {
$("<option></option>").val(item["CityID"]).text(item["CityName"]).appendTo($("#City"));
}
}
});
$("#City").change(function () {
DistrictBind();
})
//绑定地区
$.get("../../ashx/addresscontrolHandler.ashx", { "action": "regionlist", "city": $("#City").val() }, function (regiondata) {
var regionjson = eval(regiondata);
$("#District").empty();
$.each(regionjson, function (i, item) {
if (request('id') != null) {
if (item["DistrictName"] == diqu) {
$("<option selected='selected'></option>").val(item["DistrictID"]).text(diqu).appendTo($("#District"));
}
else {
$("<option></option>").val(item["DistrictID"]).text(item["DistrictName"]).appendTo($("#District"));
}
}
else {
if (item["DistrictName"] == "黄浦区") {
$("<option selected='selected'></option>").val(item["DistrictID"]).text("黄浦区").appendTo($("#District"));
}
else {
$("<option></option>").val(item["DistrictID"]).text(item["DistrictName"]).appendTo($("#District"));
}
}
});
});
});

});

//绑定城市
function CityBind() {
$.get("../../ashx/addresscontrolHandler.ashx", { "action": "citylist", "province": $("#Province").val() }, function (citydata) {
var cityjson = eval(citydata);
$("#City").empty();
$.each(cityjson, function (i, item) {
if (item["CityName"] == "请选择") {
$("<option selected='selected'></option>").val(item["CityID"]).text(item["CityName"]).appendTo($("#City"));
}
else {
$("<option></option>").val(item["CityID"]).text(item["CityName"]).appendTo($("#City"));
}
});
DistrictBind();
$("#City").change(function () {
DistrictBind();
})
});

}

function DistrictBind() {
$.get("../../ashx/addresscontrolHandler.ashx", { "action": "regionlist", "city": $("#City").val() }, function (regiondata) {
var regionjson = eval(regiondata);
$("#District").empty();
$.each(regionjson, function (i, item) {
if (item["DistrictName"] == "请选择") {
$("<option selected='selected'></option>").val(item["DistrictID"]).text("黄浦区").appendTo($("#District"));
}
else {
$("<option></option>").val(item["DistrictID"]).text(item["DistrictName"]).appendTo($("#District"));
}
});
});
}

$("#Province").live('change', function () {
if ($('#Province option:selected').text() == '国外') {
$("#District").hide();
$("#City").hide();
}
else {
$("#District").show();
$("#City").show();
}
CityBind();
});