落伍首发 php+mysql 采用ajax技术的 省 市 地 3级联动无刷新菜单 源码

2018-09-07 12:13

阅读:618

  绝对原创
测试地址:

测试页代码:
复制代码 代码如下:
<html>
<head>
<metahttp-equiv=Content-Typecontent=text/html;charset=gb2312/>
<title>php+ajax动态生成下拉菜单</title>
<scriptlanguage=JavaScriptsrc=../include/js/regions.js></script>
</head>
<body>
<formname=form1method=postaction=>
<tr><td>{$regionss(中华人民共和国)}</td></tr>
</form>
</body>
</html>

regionss函数代码:
QUOTE:
复制代码 代码如下://省市地3级联动下拉菜单函数regionss省.市.地
functionregionss($country=中华人民共和国)
{
global$db;$i=1;
$text=<selectid=\select1\name=\select1\onchange=\startRequest()\style=\width:90px;\><optionvalue=\\>省/市/自治区</option>\n;

$result=$db->query(SELECTprovinceFROM.TABLE_PROVINCE.WHEREcountry=$countryORDERBYprovinceid);
while($r=$db->fetch_array($result))
{
$text.=<optionvalue=.$r[province].>.$r[province].</option>;
$i++;
}
$text.=</select>;
$text.=&nbsp<selectid=\select2\name=\select2\onchange=\startRequesta()\style=\width:90px;\><optionvalue=\\>市/县/区</option></select>\n;
$text.=<selectid=\select3\name=\select3\style=\width:90px;\><optionvalue=\\>县级市/县</option></select>\n;
return$text;

}
regions.js的代码:



复制代码 代码如下://varab=newArray();
varxmlHttp;
varxmlHttpa;
functioncreateXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp=newActiveXObject(Microsoft.XMLHTTP);
}
elseif(window.XMLHttpRequest){
xmlHttp=newXMLHttpRequest();
}
}
functioncreateXMLHttpRequesta(){
if(window.ActiveXObject){
xmlHttpa=newActiveXObject(Microsoft.XMLHTTP);
}
elseif(window.XMLHttpRequest){
xmlHttpa=newXMLHttpRequest();
}
}

functionstartRequest(){
createXMLHttpRequest();
createXMLHttpRequesta();
xmlHttp.onreadystatechange=handleStateChange;
xmlHttpa.onreadystatechange=handleStateChangearea;
document.getElementById(select2).options.length=0;
document.getElementById(select3).options.length=0;
varurl=document.form1.select1.value;
varqurl=/regions.php?province=+url+&time=+newDate().getTime();
xmlHttp.open(GET,qurl,true);
xmlHttp.send(null);
//setTimeout(startRequest(),2000);
}

functionhandleStateChange(){
if(xmlHttp.readyState==4){
if(xmlHttp.status==200){
varobj=document.getElementById(select2);//将服务器返回的字符串写到页面中ID为select2的区域
obja=document.getElementById(select3);//将服务器返回的字符串写到页面中ID为select3的区域
eval(xmlHttp.responseText);

}
}
}
functionhandleStateChangearea(){
eval(xmlHttpa.responseText);
}
//varab=newArray();

functionstartRequesta(){
createXMLHttpRequesta();
xmlHttpa.onreadystatechange=handleStateChangea;
document.getElementById(select3).options.length=0;
varurl=document.form1.select2.value;
varqurl=/regions.php?city=+url+&time=+newDate().getTime();
xmlHttpa.open(GET,qurl,true);
xmlHttpa.send(null);
//setTimeout(startRequest(),2000);
}

functionhandleStateChangea(){
if(xmlHttpa.readyState==4){
if(xmlHttpa.status==200){
varobja=document.getElementById(select3);
eval(xmlHttpa.responseText);
//将服务器返回的字符串写到页面中ID为select3的区域

}
}
}
数据岛regions.php页面代码



复制代码 代码如下:<?php
requirecommon.php;
$city=$city?$city:;
$area=$area?$area:;
if($province&&$city==){
global$db;$i=1;

$result=$db->query(SELECTDISTINCTcityFROM.TABLE_CITY.WHEREprovince=$provinceORDERBYcityid);
while($r=$db->fetch_array($result))
{
$r[city]=iconv(gb2312,UTF-8,$r[city]);
echoobj.options[obj.options.length]=newOption(.$r[city].,.$r[city].);\n;
$i++;
}
$resultarea=$db->query(SELECTDISTINCTcityFROM.TABLE_CITY.WHEREprovince=$provinceORDERBYcityid);
$r=$db->fetch_array($resultarea);
$city=$r[city];
$resulta=$db->query(SELECTDISTINCTareaFROM.TABLE_CITY.WHEREcity=$cityORDERBYcityid);
while($ra=$db->fetch_array($resulta))
{
$ra[area]=iconv(gb2312,UTF-8,$ra[area]);
echoobja.options[obja.options.length]=newOption(.$ra[area].,.$ra[area].);\n;
$i++;
}


}
if($city&&$province==){
global$db;$i=1;

$result=$db->query(SELECTDISTINCTareaFROM.TABLE_CITY.WHEREcity=$cityORDERBYcityid);
while($r=$db->fetch_array($result))
{
$r[area]=iconv(gb2312,UTF-8,$r[area]);
echoobja.options[obja.options.length]=newOption(.$r[area].,.$r[area].);\n;
$i++;
}
}
?>
地址信息数据库:

采用的是phpcms3.0里自带的数据库,我没有进行任何改动

本程序可以在phpcms3.0里直接使用,若在其他地方使用请自己修改


评论


亲,登录后才可以留言!