jquery ajax は、ドロップダウン ボックスの 3 レベルの非更新リンクを実装し、選択された value_jquery を保存して維持します。

機能: 州、市、地域の 3 レベルのリンク。jquery ajax を使用してデータ バインディングを取得します。選択した値は保存され、ページの更新または送信後に選択された状態を維持できます。

次のコードを別の js ファイルに配置し、ページ上で参照して呼び出します。

コードをコピーします コードは次のとおりです。以下のように:

//获取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($("").val("-1").html("--请选择--"));
        }
        //从新选择省份或者从新选择城市都会初始化区域
        $("select[id$=ddlAreaName] > option").remove();
        $ddlarea.append($("").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") {
.val(), 0.5, true);
} else {
$("select[name$=ddlAreaName] > option").remove( ); ").val("-1").html("--選択してください--"));


//地区名にデータが入力されておらず、市がデータを選択している場合、データをロードします
if ($("select[id$=ddlAreaName] > option").length = = 1 && $ddlcity .val ()! = "-1") {
Loadwater ($ ddlcity.val (), "selectareaname");

if (エリア名 != null && エリア名 != "未定義" && エリア名 != "") {

$("select[id=ddlAreaName] > option[ value='" エリア名 "']").attr("選択済み" 、 "true");

}
}

$ddlarea.bind("change keyup", function() {
if ($(this).val() != "-1") {
//クッキーを保存する値を選択

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) {
bindingWater(data, typename);
}
});
}

関数bindWater(data, typename) {

if (typename == "SelectCity") { //都市をバインド

"＆lt; option＆gt;＆lt;/option＆gt;"）。val（ "-1"）。html（ " - select-"））;

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

🎜>

$ ("select [name $ = ddlareaname] & gt; option"). Remove (); // 元のオプションを削除します

$ ("select [ID $ = ddlareaname]")。 ;").val("-1").html("--選択してください--"));

for (var i = 0; i $("select[id$=ddlAreaName]").append($("< /option>").val(data[i].AreaName).html(data[i].AreaName));
ページが送信されると、州の値がバインドされます。 selectvalue で取得する必要があります。市区町村の選択されたデータは、Request["idname"]
で取得する必要があります。