当前位置: 移动技术网 > IT编程>开发语言>PHP > php实现三级级联下拉框

php实现三级级联下拉框

2017年12月12日  | 移动技术网IT编程  | 我要评论

食品质量问题,100号真空泵油,www.xxyy.name

这是我在网上查找到的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程序设计有所帮助。

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网