ajax三级下拉列表联动

最新推荐文章于 2017-05-18 14:59:00 发布

FateStay_Night

最新推荐文章于 2017-05-18 14:59:00 发布

阅读量564

点赞数

分类专栏： web开发文章标签： ajax

本文链接：https://blog.csdn.net/shenyingzgd/article/details/48312115

版权

web开发专栏收录该内容

3 篇文章 0 订阅

订阅专栏

添加和编辑时用到，trigger（”change”,value），ajax同步

 // 下拉列表初始化
        function ddlInitFun() {
            // 省下拉列表
            $.ajax({
                url: "../Admin/Handler/provinceHandler.ashx",
                data: {
                    "action": "list",
                    "parentId": "1", // 获取省列表
                },
                type: "post",
                async: false,
                success: function (backdata) {
                    var temp = backdata.split(',');
                    for (var i = 0; i < temp.length; i += 2) {
                        $("#provinceId").append($("<option/>").text(temp[i + 1]).attr("value", temp[i]));
                    }
                }, error: function (error) {
                    console.log(error);
                }
            });

            // 市下拉列表
            $("#provinceId").change(function (e, cityValue) { // function() -> function(e,cityValue) 自定义事件
                // 清除二级下路列表
                $("#cityId").empty();
                $("#cityId").append($("<option/>").text("请选择市").attr("value", ""));

                $.ajax({
                    url: "../Admin/Handler/provinceHandler.ashx",
                    data: {
                        "action": "list",
                        "parentId": $("#provinceId").val(), // 获取市列表
                    },
                    type: "post",
                    async: false,
                    success: function (backdata) {
                        var temp = backdata.split(',');
                        for (var i = 0; i < temp.length; i += 2) {
                            $("#cityId").append($("<option/>").text(temp[i + 1]).attr("value", temp[i]));
                        }
                        // 赋值
                        if (typeof (cityValue) != "undefined") {
                            $("#cityId").val(cityValue);
                        }
                    }, error: function (error) {
                        console.log(error);
                    }
                });
            });

            // 县
            $("#cityId").change(function (e, countyValue) {
                // 清除三级下路列表
                $("#countyId").empty();
                $("#countyId").append($("<option/>").text("请选择县、区").attr("value", ""));

                $.ajax({
                    url: "../Admin/Handler/provinceHandler.ashx",
                    data: {
                        "action": "list",
                        "parentId": $("#cityId").val(), // 获取市列表
                    },
                    type: "post",
                    async: false,
                    success: function (backdata) {
                        var temp = backdata.split(',');
                        for (var i = 0; i < temp.length; i += 2) {
                            $("#countyId").append($("<option/>").text(temp[i + 1]).attr("value", temp[i]));
                        }
                        // 赋值
                        if (typeof (countyValue) != "undefined") {
                            $("#countyId").val(countyValue);
                        }
                    }, error: function (error) {
                        console.log(error);
                    }
                });
            });
        }