程式師世界 >> 編程語言 >> 網頁編程 >> PHP編程 >> 關於PHP編程 >> 省份城市菜單聯動，AJAX 3級菜單聯動

省份城市菜單聯動，AJAX 3級菜單聯動

編輯：關於PHP編程

首先看JQ的擴展如下：

//city selected

jQuery.fn.cityselect = function(n,s1,s2,s3) {
if ((n!=3)&&(n!=2)) {n=2};
if (s1=="") {s1="province"};
if (s2=="") {s2="city"};
if (s3=="") {s3="area"};

if (n==2){//二級聯動
   //alert(s1+$("select[@name="+s1+"] option[@selected]").val());
      $("select[@name="+s1+"]").bind("change",function(event) {
      $.ajax({
        type: "GET",
        url: "/inc/lib/ajax_city.php",
        data: "n=v2&cityid="+$("select[@name="+s1+"] option[@selected]").val(),
        success: function(opt){$("select[@name="+s2+"]").empty().append(opt);}
       });
     });

}

if (n==3){//三級聯動

   $("select[@name="+s1+"]").bind("change",function(event) {
      $.ajax({
        type: "GET",
        url: "/inc/lib/ajax_city.php",
        data: "n=v2&cityid="+$("select[@name="+s1+"] option[@selected]").val(),
        success: function(opt){
        $("select[@name="+s2+"]").empty().append(opt);
           $.ajax({
          type: "GET",
          url: "/inc/lib/ajax_city.php",
          data: "n=v3&cityid="+$("select[@name="+s2+"] option[@selected]").val(),
          success: function(opt){
          $("select[@name="+s3+"]").empty().append(opt);
          }
         });
        }
       });
     });
    $("select[@name="+s2+"]").bind("change",function(event) {
      $.ajax({
      type: "GET",
      url: "/inc/lib/ajax_city.php",
      data: "n=v3&cityid="+$("select[@name="+s2+"] option[@selected]").val(),
      success: function(opt){ $("select[@name="+s3+"]").empty().append(opt);}
     });

   });

    }

};

接下來是PHP裡的函數如下========

//城市聯動腳本
function cityselect($n=2,$s1=province,$s2=city,$s3=area,$v1=320000,$v2=320500,$v3=320501){
   $db = new DB_Sql;       //初始化數據庫
$db->connect(DB_Database, DB_Host, DB_User, DB_Password); //數據庫連接
$db->DB_Sql("set names gbk");
//聯動AJAX腳本
$tmp = "<script type="text/javascript"> ";
$tmp .= $(document).ready(;
$tmp .= "function(){ ";
$tmp .= $().cityselect(.$n.,.$s1.,.$s2.,.$s3.);;
$tmp .= " ";
$tmp .= "}); ";
$tmp .= "</script> ";
//省份選擇
$tmp .= "<select id="".$s1."" name="".$s1."" > ";
$db->query("select * from sz_chinacity where right(CityPostCode, 4) = 0000 order by CityID asc");
   while ($db->next_record()){
    if ($db->Record[CityPostCode]==$v1){
     $tmp .= "<option value="".$db->Record[CityPostCode]."" selected>".$db->Record[CityName]."</option> ";
    }else{
     $tmp .= "<option value="".$db->Record[CityPostCode]."">".$db->Record[CityName]."</option> ";
    }
   }
$tmp .= "</select> ";
//城市選擇
$tmp .= "<select id="".$s2."" name="".$s2.""> ";
$cityid = substr($v1,0,2);
$db->query("select * from sz_chinacity where Right(CityPostCode, 2) = 00 and Left(CityPostCode, 2)=".$cityid." and Right(CityPostCode, 4) <> 0000 order by CityID asc");
   while ($db->next_record()){
    if ($db->Record[CityPostCode]==$v2){
     $tmp .= "<option value="".$db->Record[CityPostCode]."" selected>".$db->Record[CityName]."</option> ";
    }else{
     $tmp .= "<option value="".$db->Record[CityPostCode]."">".$db->Record[CityName]."</option> ";
    }
   }
$tmp .= "</select> ";

if ($n==3){
//地區選擇
$tmp .= "<select id="".$s3."" name="".$s3.""> ";
$cityid = substr($v2,0,4);
$db->query("select * from sz_chinacity where Left(CityPostCode, 4)=".$cityid." and Right(CityPostCode, 2) <> 00 order by CityID asc");
   while ($db->next_record()){
    if ($db->Record[CityPostCode]==$v3){
     $tmp .= "<option value="".$db->Record[CityPostCode]."" selected>".$db->Record[CityName]."</option> ";
    }else{
     $tmp .= "<option value="".$db->Record[CityPostCode]."">".$db->Record[CityName]."</option> ";
    }
   }
$tmp .= "</select> ";
}
echo $tmp;
}