無重新整理省市縣串聯更新JAVASCRIPT+C#+SQL Server

最後更新：2018-12-04 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

html代碼

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<script src="AJAX.js" type="text/javascript"></script>
<title>無標題頁</title>
    <script type="text/javascript">
        var xmlHttp;
        function createXMLHttpRequest()
        {
            if(window.ActiveXObject)
            {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            else if(window.XMLHttpRequest)
            {
                xmlHttp = new XMLHttpRequest();
            }
        }
        function changeprovince(J)
        {
            clearCity();
            createXMLHttpRequest();
            var url= "Handler.ashx?pid=" + J +"&flag=0";
            xmlHttp.open("GET",url,true);
            xmlHttp.onreadystatechange=showResult;
            xmlHttp.send(null);
        }
        function showResult()
        {
            if(xmlHttp.readyState==4)
            {
                if(xmlHttp.status==200)
                {
                      var content=xmlHttp.responseText;
                      content =content.substring(0,content.length-1);

           var arrTmp = content.split(",");
           var myEle;
           if(arrTmp.length>0)
           {
               for(var i=0;i<arrTmp.length;i++)
               {
                   myEle = document.createElement("option") ;
                myEle.value = arrTmp[i].toString();
                i+=1;
                myEle.text = arrTmp[i].toString();
                form1.city.add(myEle) ;
               }
                            form1.Text1.value="載入完成";
                    }
                }
                else
                {
                    alert(xmlHttp.status);
                }
            }
            else
            {
                form1.Text1.value="正在載入...";
            }
        }
        function clearCity()
        {
            var city=document.form1.city;
            for(var i=city.options.length;i>=0;i--)
            {
                city.options[i]=null;
            }
            var area=document.form1.area;
            for(var y=area.options.length;y>=0;y--)
            {
                area.options[y]=null;
            }
        }
        function cleararea()
        {
            var area=document.form1.area;
            for(var y=area.options.length;y>0;y--)
            {
                area.options[y]=null;
            }
        }
        function citychange(a)
        {
//            alert(a.options[a.options.selectedIndex].value);      //得到所選項的Index
//            alert(a.options[a.options.selectedIndex].text);    //得到所選項的文本值
            cleararea();
            createXMLHttpRequest();
            var url= "Handler.ashx?pid=" + a +"&flag=1";
//            alert(url);
            xmlHttp.open("GET",url,true);
            xmlHttp.onreadystatechange=showarea;
            xmlHttp.send(null);
        }
        function showarea()
        {
            if(xmlHttp.readyState==4)
            {
                if(xmlHttp.status==200)
                {
                      var content=xmlHttp.responseText;
                      content =content.substring(0,content.length-1);
                      //alert(content);
           var arrTmp = content.split(",");
           var myEle;
           if(arrTmp.length>0)
           {
               for(var i=0;i<arrTmp.length;i++)
               {
                   myEle = document.createElement("option") ;
                myEle.value = arrTmp[i].toString();
                i+=1;
                myEle.text = arrTmp[i].toString();
                form1.area.add(myEle) ;
               }
                            form1.Text1.value="載入完成";
                    }
                }
                else
                {
//                    alert('測試');
                    alert(xmlHttp.status);
                }
            }
            else
            {
                form1.Text1.value="正在載入...";
            }
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="Label1" runat="server" Text="省"></asp:Label>
        <asp:DropDownList ID="province" runat="server" Width="123px">
        </asp:DropDownList>
        <asp:Label ID="Label2" runat="server" Text="市"></asp:Label> 
        <select id="city" style="width: 122px" onchange="citychange(this.options[this.options.selectedIndex].value)" >
        </select>
        <asp:Label ID="Label3" runat="server" Text="區"></asp:Label>
        <select id="area" style=" width: 141px">
        </select>
        <input id="Text1" type="text" /></div>
    </form>
</body>
</html>

Handler.ashx代碼

<%@ WebHandler Language="C#" Class="Handler" %>

using System;
using System.Web;
using System.Data.SqlClient;
using System.Data.Sql;

public class Handler : IHttpHandler {

    public void ProcessRequest (HttpContext context)
    {
        context.Response.ContentType = "text/plain";
        string c = System.Configuration.ConfigurationSettings.AppSettings["con"];
        SqlConnection con = new SqlConnection(c);
        con.Open();
        if (context.Request.QueryString["flag"].ToString() == "0")
        {
            string pid = context.Request.QueryString["pid"];
            string content = "";
            string sql = "select * from city where father=" + pid;
            SqlCommand com = new SqlCommand(sql, con);
            SqlDataReader rs = com.ExecuteReader();
            while (rs.Read())
            {
                content += rs["cityID"] + "," + rs["city"] + ",";
            }
            context.Response.Write(content);

        }
        if (context.Request.QueryString["flag"].ToString() == "1")
        {
            string pid = context.Request.QueryString["pid"];
            string content = "";
            string sql = "select * from area where father=" + pid;
            SqlCommand com = new SqlCommand(sql, con);
            SqlDataReader rs = com.ExecuteReader();
            while (rs.Read())
            {
                content += rs["areaID"] + "," + rs["area"] + ",";
            }
            context.Response.Write(content);
        }
        con.Close();
    }

    public bool IsReusable {
        get {
            return false;
        }
    }
}

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More