首頁 後端開發 php教程 省份城市菜单联动,AJAX 3级菜单联动_PHP教程

省份城市菜单联动,AJAX 3级菜单联动_PHP教程

Jul 13, 2016 pm 05:37 PM
ajax 城市 擴充 省份 聯動 選單

首先看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 = " ";
//省份选择
$tmp .= " ";
//城市选择
$tmp .= " ";


if ($n==3){
//地区选择
$tmp .= " ";
}
echo $tmp;
}

调用的时候:

www.bkjia.comtruehttp://www.bkjia.com/PHPjc/486524.htmlTechArticle首先看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=are...
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

PHP 函數的擴充和第三方模組 PHP 函數的擴充和第三方模組 Apr 13, 2024 pm 02:12 PM

若要擴充PHP函數功能,可以使用擴充和第三方模組。擴充功能提供附加函數和類,可透過pecl套件管理器安裝和啟用。第三方模組提供特定功能,可透過Composer套件管理器安裝。實作案例包括使用擴充解析複雜JSON資料和使用模組驗證資料。

旅程IPx經典動畫《西遊記》 西行旅程無畏無懼 旅程IPx經典動畫《西遊記》 西行旅程無畏無懼 Jun 10, 2024 pm 06:15 PM

穿越蒼茫征途,踏足西遊之境!今日,征途IP正式宣布將與央視動畫《西遊記》展開跨界合作,共同打造一場融合了傳統與創新的文化盛宴!此次攜手,不僅標誌著兩大國產經典品牌的深度合作,更彰顯了征途系列在弘揚中國傳統文化道路上的不懈努力與堅持。征途系列自誕生以來,便憑藉其深厚的文化底蘊和多元化的遊戲玩法,受到玩家們的喜愛。在文化傳承方面,征途系列更是始終保持著對中國傳統文化的敬意與熱愛,將傳統文化元素巧妙地融入遊戲,為玩家們帶來了更多的樂趣與啟發。而央視動畫《西遊記》則是陪伴了一代又一代人成長的經典之作,其

解決jQuery AJAX請求遇到403錯誤的方法 解決jQuery AJAX請求遇到403錯誤的方法 Feb 20, 2024 am 10:07 AM

標題:解決jQueryAJAX請求出現403錯誤的方法及程式碼範例403錯誤是指伺服器禁止存取資源的請求,通常會導致出現這個錯誤的原因是請求缺少權限或被伺服器拒絕。在進行jQueryAJAX請求時,有時會遇到這種情況,本文將介紹如何解決這個問題,並提供程式碼範例。解決方法:檢查權限:首先要確保請求的URL位址是正確的,同時驗證是否有足夠的權限來存取該資

PHP 與 Ajax:建立一個自動完成建議引擎 PHP 與 Ajax:建立一個自動完成建議引擎 Jun 02, 2024 pm 08:39 PM

使用PHP和Ajax建置自動完成建議引擎:伺服器端腳本:處理Ajax請求並傳回建議(autocomplete.php)。客戶端腳本:發送Ajax請求並顯示建議(autocomplete.js)。實戰案例:在HTML頁面中包含腳本並指定search-input元素識別碼。

鳴潮今州城寶箱全收集 鳴潮今州城寶箱全收集 Mar 16, 2024 pm 02:28 PM

鳴潮今州城有很多的寶箱,很多玩家想知道寶箱在哪,小編已經把所有寶箱位置標記出來,玩家跟隨標記數字一個一個去尋找就可以了,具體內容一起來看看這篇鳴潮今州城寶箱全收集最新匯總。鳴潮攻略大全鳴潮今州城寶箱全收集位置一:今州城(1-25)二十五個寶箱,五個聲匣位置二:今州城(26-41)十五個寶箱,三個聲匣,兩個飛獵手

解決jQuery AJAX請求403錯誤的方法 解決jQuery AJAX請求403錯誤的方法 Feb 19, 2024 pm 05:55 PM

jQuery是一個受歡迎的JavaScript函式庫,用來簡化客戶端端的開發。而AJAX則是在不重新載入整個網頁的情況下,透過發送非同步請求和與伺服器互動的技術。然而在使用jQuery進行AJAX請求時,有時會遇到403錯誤。 403錯誤通常是伺服器禁止存取的錯誤,可能是由於安全性原則或權限問題導致的。在本文中,我們將討論如何解決jQueryAJAX請求遭遇403錯誤

如何解決jQuery AJAX報錯403的問題? 如何解決jQuery AJAX報錯403的問題? Feb 23, 2024 pm 04:27 PM

如何解決jQueryAJAX報錯403的問題?在開發網頁應用程式時,經常會使用jQuery來發送非同步請求。然而,有時在使用jQueryAJAX時可能會遇到錯誤代碼403,表示伺服器禁止存取。這種情況通常是由伺服器端的安全性設定所導致的,但可以透過一些方法來解決這個問題。本文將介紹如何解決jQueryAJAX報錯403的問題,並提供具體的程式碼範例。一、使

炸雞大業,不容差池! 《逆水寒》聯動肯德基福上天,玩家社死'聞雞起舞” 炸雞大業,不容差池! 《逆水寒》聯動肯德基福上天,玩家社死'聞雞起舞” Apr 17, 2024 pm 06:34 PM

日期,《逆水寒》官宣將於4月19號-5月12號與肯德基展開聯動,但聯動的具體內容卻讓許多人蚌埠住了,連番直說「民上天了」、「要社死了」!原因就出在這次主題活動的口號上,曾經見識過《原神》《崩鐵》肯德基聯動的小伙伴肯定有印象,什麼“異世相遇、盡享美味”,到了《逆水寒》這裡就成了:對店員喊出「神候府查案,爾等何人?」店員需回答「炸雞大業,不容差池!」對員工的訓練指南:絕對不能笑!不只這個,這次聯動還辦起了舞蹈大賽,到主題店做出「聞『基』起舞」舞蹈動作,還能獲得一個搖搖樂小立牌。民,太民了!但就是要這

See all articles