jquery ajax实现下拉框三级无刷新联动,且保存保持选中值状态

　　//获取cookie值

　　function readCookie(name) {

　　var cookieValue = "";

　　var search = name + "=";

　　if (document.cookie.length > 0) {

　　offset = document.cookie.indexOf(search);

　　if (offset != -1) {

　　offset += search.length;

　　end = document.cookie.indexOf(";", offset);

　　if (end == -1) end = document.cookie.length;

　　cookieValue = unescape(document.cookie.substring(offset, end))

　　}

　　}

　　return cookieValue;

　　}

　　//保存cookie值

　　function writeCookie(name, value, hours, escp) {

　　var expire = "";

　　if (hours != null) {

　　expire = new Date((new Date()).getTime() + hours * 3600000);

　　expire = "; expires=" + expire.toGMTString();

　　}

　　if (escp == "True") {

　　document.cookie = name + "=" + value + expire;

　　} else {

　　document.cookie = name + "=" + escape(value) + expire;

　　}

　　}

　　//省市区，流域，水系，断面条件选择

　　$(function() {

　　var $ddlprovince = $("#ddlProvince");     //省份

　　var $ddlcity = $("#ddlCity");      //城市

　　var $ddlarea = $("#ddlAreaName");         //区域

　　//根据省份查询城市

　　//$ddlprovince.focus(); //不要加focus,否则设置selected有问题

　　$ddlprovince.bind("change keyup", function() {

　　if ($(this).val() != "-1") {

　　loadWater($(this).val(), "SelectCity");

　　} else {

　　$("select[id$=ddlCity] > option").remove();

　　$ddlcity.append($("<option></option>").val("-1").html("--请选择--"));

　　}

　　//从新选择省份或者从新选择城市都会初始化区域

　　$("select[id$=ddlAreaName] > option").remove();

　　$ddlarea.append($("<option></option>").val("-1").html("--请选择--"));

　　});

　　//如果城市没有填充数据，省份有选择数据则加载数据

　　if ($("select[id$=ddlCity] > option").length == 1 && $ddlprovince.val() != "-1") {

　　loadWater($ddlprovince.val(), "SelectCity");

　　//读cookie,有值则设为选中状态

　　var cityname = readCookie("JQ_CityName");

　　if (cityname != null && cityname != "undefined" && cityname != "") {

　　//$("select[id=ddlWaterXiName] > option:contains('" + watername + "')").attr("selected", "true");

　　$("select[id$=ddlCity] > option[value='" + cityname + "']").attr("selected", "true");

　　}

　　}

　　//根据城市查询区域

　　//$ddlcity.focus();

　　$ddlcity.bind("change keyup", function() {

　　if ($(this).val() != "-1") {

　　loadWater($(this).val(), "SelectAreaName");

　　//选中值存cookie

　　writeCookie("JQ_CityName", $(this).val(), 0.5, true);

　　} else {

　　$("select[name$=ddlAreaName] > option").remove();

　　$ddlarea.append($("<option></option>").val("-1").html("--请选择--"));

　　}

　　});

　　//如果区名没有填充数据，城市有选择数据则加载数据

　　if ($("select[id$=ddlAreaName] > option").length == 1 && $ddlcity.val() != "-1") {

　　loadWater($ddlcity.val(), "SelectAreaName");

　　//读cookie,有值则设为选中状态

　　var areaname = readCookie("JQ_AreaName");

　　if (areaname != null && areaname != "undefined" && areaname != "") {

　　$("select[id=ddlAreaName] > option[value='" + areaname + "']").attr("selected", "true");

　　}

　　}

　　$ddlarea.bind("change keyup", function() {

　　if ($(this).val() != "-1") {

　　//选中值存cookie

　　writeCookie("JQ_AreaName", $(this).val(), 0.5, true);

　　}

　　});

　　});

　　function loadWater(selectedItem, typename) {

　　$.ajax({

　　type: "GET",

　　url: "/GetWaterxiname.ashx",

　　data: { usetype: typename, id: selectedItem },

　　contentType: "application/json; charset=utf-8",

　　dataType: "json",

　　async: false,

　　success: function Success(data) {

　　bindWater(data, typename);

　　}

　　});

　　}

　　function bindWater(data, typename) {

　　if (typename == "SelectCity") {    //绑定城市

　　$("select[name$=ddlCity] > option").remove(); //删除原有的option

　　$("select[id$=ddlCity]").append($("<option></option>").val("-1").html("--请选择--"));

　　for (var i = 0; i < data.length; i++) {

　　$("select[id$=ddlCity]").append($("<option></option>").val(data[i].City).html(data[i].City));

　　}

　　}

　　else if (typename == "SelectAreaName") {

　　$("select[name$=ddlAreaName] > option").remove(); //删除原有的option

　　$("select[id$=ddlAreaName]").append($("<option></option>").val("-1").html("--请选择--"));

　　for (var i = 0; i < data.length; i++) {

　　$("select[id$=ddlAreaName]").append($("<option></option>").val(data[i].AreaName).html(data[i].AreaName));

　　}

　　}

　　}