正文

字體大小： 中

PHP+Ajax實現二級聯動下拉菜單！

(2009-12-05 01:11:39)

標簽：

雜談

數據庫

...............................................................................................................................

...............................................................................................................................

test.html

................................................................................................................................

php_ajax聯動下拉菜單

content="text/html;charset=gb2312">

function query(){

var pid = document.getElementByIdx("bigClassName").value;

if(pid!=""){

createRequest('query.php?pid='+pid);

}

}

action="=$PHP_SELF?>?"

method="get" >

οnchange="query()">

value="">--選擇大類--

$link=mysql_connect("localhost","root","root");

mysql_select_db("sortclass") or die("沒有此數據庫！");

$sql="select cid,cname from class where pid=0";

mysql_query("set names gb2312");

$res=mysql_query($sql,$link);

while($result=mysql_fetch_assoc($res)){

echo "

value='".$result["cid"]."'>".$result["cname"]."

";

}

?>

value="">--選擇小類--

/>

........................................................................................................................................

ajax.js

........................................................................................................................................

var http_request = false;

function createRequest(url) {

//初始化對象并發出XMLHttpRequest請求

http_request = false;

if (window.XMLHttpRequest) {

//Mozilla等其他瀏覽器

http_request = new

XMLHttpRequest();

if

(http_request.overrideMimeType) {

http_request.overrideMimeType("text/xml");

}

} else if (window.ActiveXObject) {

//IE瀏覽器

try {

http_request

= new ActiveXObject("Msxml2.XMLHTTP");

} catch (e) {

try {

http_request = new ActiveXObject("Microsoft.XMLHTTP");

} catch (e) {}

}

}

if (!http_request) {

alert("不能創建XMLHTTP實例!");

return false;

}

http_request.onreadystatechange =

alertContents;

//指定響應方法

http_request.open("GET", url,

true);

//發出HTTP請求

http_request.send(null);

}

function alertContents() {

//處理服務器返回的信息

if (http_request.readyState == 4) {

if (http_request.status ==

200) {

var

smallClassName=document.getElementByIdx("smallClassName");

var

dataArray=[];

//alert(http_request.responseText);

myVariable=http_request.responseText;//形如: 1,新聞中心;2,學習園地;

var

stringArray = myVariable.split(";");//以;分隔字符串

stringArray.pop();//移除數組最后一個元素,stringArray[0]==1,新聞中心

stringArray[1]==2,學習園地

var

len=stringArray.length;

for(var

i=0;i

dataArray[i]= stringArray[i].split(",");// 循環數據條數按,分割字符串

}

//alert(dataArray[1][0]);//返回 新聞中心

//初始化smallClassName的數據

smallClassName.length=0;

var

alertOption=document.createElement_x("OPTION");

alertOption.value="";

alertOption.text="--選擇小類--";

smallClassName.add(alertOption);

for(var

j=0;j

var objOption=document.createElement_x("OPTION");

objOption.value = dataArray[j][0];

objOption.text = dataArray[j][1];

smallClassName.add(objOption);

}

} else {

alert('您請求的頁面發現錯誤');

}

}

}

...................................................................................................................................

query.php

...................................................................................................................................

error_reporting(E_ERROR|E_WARNING|E_PARSE);

$link=mysql_connect("localhost","root","root");

mysql_select_db("sortclass",$link) or die("no such

database!");

//$GB2312string=iconv( 'UTF-8', 'gb2312//IGNORE' ,

$RequestAjaxString);

//Ajax中先用encodeURIComponent對要提交的中文進行編碼

mysql_query("set names gb2312");

$pid=$_GET[pid];

$res=mysql_query("select cid,cname from class where

pid='$pid'",$link);

header('Content-type:

text/html;charset=GB2312');

//指定發送數據的編碼格式為GB2312

while($info=mysql_fetch_array($res)){

$str.=$info["cid"].",".$info["cname"];

$str.=";";

}

echo $str;

?>

.............................................................................................................................................

分享：

喜歡

閱讀┊

┊

┊┊

┊打印┊

已投稿到：

文章轉載請注明來源。新輝網主頁 > 網頁基礎 > Javascript/Ajax >

標題：PHP+Ajax實現二級聯動下拉菜單！

地址：http://www.a55.com.cn/a/9422.html

關鍵詞：PHP+Ajax實現二級聯動下拉菜單！_zhuwujiasi

總結

以上是生活随笔為你收集整理的php下拉列表 二级 联动,PHP+Ajax实现二级联动下拉菜单！的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。