Re: 实用的mysql+ajax+php 三级级联下拉框
[code]<!--
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("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("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;
}
-->[/code]