<script type="text/javascript">

    $(document).ready(function() {

        GetByJquery();

        $("#ddlProvince").change(function() { GetCity() });

        $("#ddlCity").change(function() { GetDistrict() });

    });

    function GetByJquery() {

        $("#ddlProvince").empty(); //清空省份SELECT控件

        $.getJSON("/ajax/GetProvinceList", function(data) {

            $.each(data, function(i, item) {

                $("<option></option>")

                    .val(item["ProvinceID"])

                    .text(item["ProvinceName"])

                    .appendTo($("#ddlProvince"));

            });

            GetCity();

        });     

    }

    function GetCity() {

        $("#ddlCity").empty(); //清空城市SELECT控件

        var url ="/ajax/GetCityList/" + $("#ddlProvince").val();

        $.getJSON(url, function(data) {

            $.each(data, function(i, item) {

                $("<option></option>")

                    .val(item["CityID"])

                    .text(item["CityName"])

                    .appendTo($("#ddlCity"));

            });

            GetDistrict();

        });

    }

    function GetDistrict() {

        $("#ddlDistrict").empty(); //清空市区SELECT控件

        var url = "/ajax/GetDistrictList/" + $("#ddlCity").val();

        $.getJSON(url, function(data) {

            $.each(data, function(i, item) {

                $("<option></option>")

                    .val(item["DistrictID"])

                    .text(item["DistrictName"])

                    .appendTo($("#ddlDistrict"));

            });

        });

    }

</script>

<table>

<tr>

<td><select id="ddlProvince"/></td>

<td><select id="ddlCity"/></td>

<td><select id="ddlDistrict" /></td>

</tr>

</table>