這是我在網上尋找到的php實現三級級聯下拉框的資料，共用個大家，大家一起進步，具體內容如下
index.php:
<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>Ajax聯動菜單</title><script language="javascript" type="text/javascript" src="aa.js"></script></head><body><form><label><select name="sel" id="sel" onChange="showMenu(this.value);"> <option>一級分類</option><?php$conn = mysql_connect('localhost', 'root', '') or die('Could not connect: ' . mysql_error());mysql_select_db('fitment', $conn) or die ('Can\'t use database : ' . mysql_error());mysql_query("set names 'gb2312'");$str = "SELECT * FROM `fitment_sort` where supid = '0' ORDER BY `id` ASC";$result = mysql_query($str) or die("Invalid query: " . mysql_error());if($result) while ($arr = mysql_fetch_array($result)){ echo <<<EOD<option value={$arr["id"]}>{$arr["name"]}</option>EOD; }mysql_close($conn);?></select></label><label><select name="sel2" id="sel2" onChange="showMenu2(this.value)"> <option>二級分類</option> </select></label><label><select name="sel3" id="sel3"> <option>三級分類</option></select></label></form><input type=button value="send value" onClick="alert(document.getElementByIdx_x_xx_x_xx('sel').options[document.getElementByIdx_x_xx_x_xx('sel').selectedIndex].text + '-' + document.getElementByIdx_x_xx_x_xx('sel2').options[document.getElementByIdx_x_xx_x_xx('sel2').selectedIndex].text + '-' + document.getElementByIdx_x_xx_x_xx('sel3').options[document.getElementByIdx_x_xx_x_xx('sel3').selectedIndex].text)"></body></html>
aa.js
<!--var xmlHttpvar xmlHttp2//函數showMenu(str) - 功能函數1function showMenu(str) xmlHttp=GetXmlHttpObject() //調用GetXmlHttpObject()函數，建立XMLHttpRequest對象if (xmlHttp==null) //如果建立失敗，則 alert ("Browser does not support HTTP Request") return var url="get2.php" //定義url , 其主要讀取資料庫url=url+"?q="+strurl=url+"&sid="+Math.random() //Math對象的random方法，取隨機數xmlHttp.onreadystatechange=stateChanged //設定當XMLHttpRequest對象xmlHttp狀態改變時調用的函數,注意函數名後不要添加小括弧xmlHttp.open("GET",url,true) //使用XMLHttpRequest對象的open()方法 , 建立HTTP請求xmlHttp.send(null) //使用XMLHttpRequest對象的open()方法 , 發送HTTP請求}//函數showMenu(str) - 功能函數1function showMenu2(str){xmlHttp2=GetXmlHttpObject() //調用GetXmlHttpObject()函數，建立XMLHttpRequest對象if (xmlHttp2==null) //如果建立失敗，則 alert ("Browser does not support HTTP Request") return var url="get2.php" //定義url , 其主要讀取資料庫url=url+"?q2="+strurl=url+"&sid="+Math.random() //Math對象的random方法，取隨機數xmlHttp2.onreadystatechange=stateChanged2 //設定當XMLHttpRequest對象xmlHttp狀態改變時調用的函數,注意函數名後不要添加小括弧xmlHttp2.open("GET",url,true) //使用XMLHttpRequest對象的open()方法 , 建立HTTP請求xmlHttp2.send(null) //使用XMLHttpRequest對象的open()方法 , 發送HTTP請求}//函數BuildSel() , 根據返回的的字串 , 重新構建新的下拉式功能表控制項Select - 功能函數2function BuildSel(str,sel) //先清空原來的資料. sel.options.length=0; var arrstr = new Array(); arrstr = str.split(","); if(str.length>0) //迴圈 for(var i=0;i<arrstr.length;i++) var subarrstr=new Array(); subarrstr=arrstr[i].split("|"); sel.options.add(new Option(subarrstr[1],subarrstr[0])); sel.options[0].selected=true; }//函數stateChanged() - 響應HTTP請求狀態變化function stateChanged() //判斷XMLHttpRequest對象的readyState屬性值是否為4,如果為4表示非同步呼叫完成(注意:非同步呼叫完成 不代表 非同步呼叫成功)if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") //如果非同步呼叫成功 --> XMLHttpRequest對象的status屬性值為200 , html檔案在本地運行,則xmlHttp.status的傳回值為0,故應該加上xmlHttp.status==0 if(xmlHttp.status==200 || xmlHttp.status==0) //調用文件物件模型DOM的getElementById()方法尋找html檔案中的標籤txtHint , //innerHTML為IE瀏覽器中的屬性,可以用來更改標籤間文本的內容 , //xmlHttp.responseText , 通過XMLHttpRequest的responseText屬性來擷取資料 responseText,結果為字串;responseXML,結果為XML形式// document.getElementByIdx_x_xx_x_xx("txtHint").innerHTML=xmlHttp.responseText BuildSel(xmlHttp.responseText,document.getElementsByTagName_r("*").sel2) showMenu2(document.getElementsByTagName_r("*").sel2.value); }}//函數stateChanged() - 響應HTTP請求狀態變化function stateChanged2() //判斷XMLHttpRequest對象的readyState屬性值是否為4,如果為4表示非同步呼叫完成(注意:非同步呼叫完成 不代表 非同步呼叫成功)if (xmlHttp2.readyState==4 || xmlHttp2.readyState=="complete") //如果非同步呼叫成功 --> XMLHttpRequest對象的status屬性值為200 , html檔案在本地運行,則xmlHttp.status的傳回值為0,故應該加上xmlHttp.status==0 if(xmlHttp2.status==200 || xmlHttp2.status==0) //調用文件物件模型DOM的getElementById()方法尋找html檔案中的標籤txtHint , //innerHTML為IE瀏覽器中的屬性,可以用來更改標籤間文本的內容 , //xmlHttp.responseText , 通過XMLHttpRequest的responseText屬性來擷取資料 responseText,結果為字串;responseXML,結果為XML形式// document.getElementByIdx_x_xx_x_xx("txtHint").innerHTML=xmlHttp.responseText BuildSel(xmlHttp2.responseText,document.getElementsByTagName_r("*").sel3) }}//函數GetXmlHttpObject() - 建立XMLHttpRequest對象,即建立一個非同步呼叫對象function GetXmlHttpObject() var xmlHttp=null;try // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); catch (e) //Internet Explorer try xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); catch (e) xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); }return xmlHttp; -->
get2.php
<?php header('Content-Type:text/html;charset=GB2312'); $conn = mysql_connect('localhost', 'root', '') or die('Could not connect: ' . mysql_error());mysql_select_db('fitment', $conn) or die ('Can\'t use database : ' . mysql_error());mysql_query("set names 'gb2312'");//如果傳遞過來qif($_GET["q"]){$strs = "SELECT * FROM fitment_sort WHERE supid=' ".$_GET["q"]."' ";//echo $str;$results = mysql_query($strs) or die("Invalid query: " . mysql_error());if($results) while ($arrs = mysql_fetch_array($results)){ $strings .= $arrs["id"]."|".$arrs["name"].","; } echo substr($strings,0,strlen($strings)-1); }//如果傳遞過來q2if($_GET["q2"]){$str = "SELECT * FROM fitment_sort WHERE supid= '".$_GET["q2"]."'";//echo $str;$result = mysql_query($str) or die("Invalid query: " . mysql_error());if($result) while ($arr = mysql_fetch_array($result)){ $string .= $arr["id"]."|".$arr["name"].","; } echo substr($string,0,strlen($string)-1); }mysql_close($conn);?>
以上就是php實現三級級聯下拉框的相關代碼，希望對大家學習php程式設計有所協助。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
