JS三级联动

 数据层:

  public static string ShowProvince(string sql)
       {
           string strname = string.Empty;
           using (SqlConnection con = new SqlConnection(connstr))
           {
               using (SqlCommand cmd = new SqlCommand(sql, con))
               {
                   using (SqlDataAdapter dr = new SqlDataAdapter(cmd))
                   {
                       DataTable dt = new DataTable();
                       dr.Fill(dt);
                       System.Text.StringBuilder strId = new System.Text.StringBuilder();
                       System.Text.StringBuilder strName = new System.Text.StringBuilder();
                       System.Text.StringBuilder strPost = new System.Text.StringBuilder();
                       for (int i = 0; i < dt.Rows.Count; i++)
                       {
                           strId.Append(dt.Rows[i][0].ToString() + ",");
                           strName.Append(dt.Rows[i][1].ToString() + ",");
                           strPost.Append(dt.Rows[i][2].ToString() + ",");
                       }
                       return strname = strId + "/" + strName+"/"+strPost;
                   }
               }
               con.Close();
           }
       }

 

cs页面。

 BLL.tab_hospital bll_hospital = new BLL.tab_hospital();

 protected void Page_Load(object sender, EventArgs e)
    {
        string Privoncename = string.Empty;
        string post = string.Empty;
        if (!IsPostBack)
        {
            Response.Expires = 0;
            Response.CacheControl = "no-cache";
            if (Request.QueryString["action"] != null)
            {
                string mysql = "select * from tab_province";
                Privoncename = bll_hospital.GetData(mysql);
            }
            if (Request.QueryString["province_id"] != null)
            {
                string Province_id = Request.QueryString["province_id"].ToString();
                string mysql1 = "select * from tab_city where province_id ='" + Province_id + "'";
                Privoncename = bll_hospital.GetData(mysql1);
            }
            if (Request.QueryString["City_id"] != null)
            {
                string city_id = Request.QueryString["City_id"].ToString();
                string mysql2 = "select b.name,b.district_id,postal_code from tab_city a left join tab_district b on a.city_id=b.city_id  where a.city_id ='" + city_id + "'";
                Privoncename = bll_hospital.GetData(mysql2);
            }
            Response.Write(Privoncename);
            Response.Write(post);
            Response.Flush();
            Response.End();
        }
    }

 

aspx页面。

   var xmlhttp;
    //创建XMLhttpRequest
     function CreateXmlhttp()
     {
          try
          {
               if(window.ActiveXObject)
               {
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
               }
               else
               {
                    xmlhttp=new XMLHttpRequest();
               }
          }
          catch(Error)
          {
            throw new Error("无法创建xmlHttpRequest");
          }
     }
     //获取省
      window.οnlοad=function(){
      tick();
       CreateXmlhttp();
       xmlhttp.open("post","Help.aspx?action=true",true);
       xmlhttp.onreadystatechange=SelectProvince;
       xmlhttp.send(null);
      }
      //省的回调函数
      function SelectProvince()
      {      
            if(xmlhttp.readyState==4 || xmlhttp.readyState=="Complete")
            {
                var ContrPrice=xmlhttp.responseText;
                var arry=new Array();
                arry=ContrPrice.split("/");
                var text=new Array();
                var values=new Array();
                text=arry[1].split(",");
                values=arry[0].split(",");
                 var province=document.getElementById("Select1");
               for(var i=0;i<text.length-1;i++)
                {  
                    var option=document.createElement("option");
                    option.innerHTML=text[i];
                    option.value=values[i];
                    province.appendChild(option);
                }

            }
      }
       //获取市
      function Selectcity()
      {
            var PriceId=document.getElementById("Select1").value;
            CreateXmlhttp();
            xmlhttp.open("post","Help.aspx?province_id="+PriceId,true);
            xmlhttp.onreadystatechange=cityName;
            xmlhttp.send(null);
            var city=document.getElementById("Select2");
            for(var i=1;i<city.length;)
            {
                city.remove(i);
            }
             var  district =document.getElementById("Select3");
            for(var i=1;i<district.length;)
            {
                district.remove(i);
            }
           
      }
      //市的回调函数
       function cityName()
       {
            if(xmlhttp.readyState==4 || xmlhttp.readyState=="Complete")
            {
                 var City=xmlhttp.responseText;
                 var grrn= City.split("/");
                 var cityText=new Array();
                 var CityValue=new Array();
                 cityText=grrn[1].split(",");
                 CityValue=grrn[0].split(",");  
                 var city=document.getElementById("Select2");
                
                  for(var i = 0 ; i < city.length ; i++)    //填充前前先清空
              {
           if(i != 0)
            {
                city.remove(i);
                i--;
            }
           } 
                 for(var i=0;i <cityText.length-1;i++)
                 {
                
                    var option=document.createElement("option");
                    option.innerHTML=cityText[i];
                    option.value=CityValue[i];
                    city.appendChild(option);
                 }
            }
       }
      //获取县
      function SelectCounty()
      {
           CreateXmlhttp();
           var City_id=document.getElementById("Select2").value;
           xmlhttp.open("post","Help.aspx?City_id="+City_id);
           xmlhttp.onreadystatechange=County;
           xmlhttp.send(null);
         
      }
      //县的回调函数
      function County()
      {
         if(xmlhttp.readyState==4 || xmlhttp.readyState=="Complete")
         {
             var County=xmlhttp.responseText;
            var grrn=County.split("/");
            var Count_Text=grrn[0].split(",");
            var Count_value=grrn[1].split(",");
             var Count_post=grrn[2].split(",");
            var County_select=document.getElementById("Select3");
            for(var i = 0 ; i < County_select.length ; i++)    //填充前前先清空
      {
    if(i != 0)
    {
        County_select.remove(i);
        i--;
    }
   } 
            for(var i=0;i<Count_Text.length-1;i++)
            {
               var option= document.createElement("option");
                option.innerHTML=Count_Text[i];
                option.value=Count_value[i];
                County_select.appendChild(option);
            }

            
             
         }
      }

<tr>
                                    <td align="left" style="width: 203px">
                                      <asp:Label ID="Label8" runat="server" Text="*" ForeColor="red"></asp:Label>   所在地：
                                    </td>
                                    <td align="left" style="width: 359px; height: 30px;">
                                        <select id="Select1" name="D1" οnchange="Selectcity();" >
                                           <option >请选择省</option>
                                        </select>
                                        <asp:HiddenField ID="HiddenField1" runat="server" />
                                        <select id="Select2" name="D2" οnchange="SelectCounty();" >
                                           <option >请选择市</option>
                                        </select>
                                        <asp:HiddenField ID="HiddenField2" runat="server" />
                                        <select id="Select3" name="D3"  >
                                          <option > 请选择县</option>
                                        </select>
                                        <asp:HiddenField ID="HiddenField3" runat="server" />
                                    </td>
                                </tr>