程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 網頁編程 >> PHP編程 >> PHP綜合 >> php實現三級級聯下拉框

php實現三級級聯下拉框

編輯:PHP綜合

這是我在網上查找到的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 xmlHttp
var xmlHttp2
//函數showMenu(str) - 功能函數1
function 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="+str
url=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) - 功能函數1
function 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="+str
url=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 - 功能函數2
function 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'");
//如果傳遞過來q
if($_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); }
//如果傳遞過來q2
if($_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程序設計有所幫助。

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved