欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

PHP+mysql实现的三级联动菜单功能示例

程序员文章站 2023-11-14 13:47:22
本文实例讲述了php+mysql实现的三级联动菜单功能。分享给大家供大家参考,具体如下: 数据库mysql -- 数据库: `student` -- --...

本文实例讲述了php+mysql实现的三级联动菜单功能。分享给大家供大家参考,具体如下:

数据库mysql

-- 数据库: `student`
--
-- --------------------------------------------------------
--
-- 表的结构 `student`
--
create table `student` (
 `id` int(50) not null auto_increment,
 `name` varchar(50) collate utf8_unicode_ci not null,
 `dept` varchar(50) collate utf8_unicode_ci not null,
 `class` varchar(50) collate utf8_unicode_ci not null,
 `sex` varchar(50) collate utf8_unicode_ci not null,
 `dept_id` int(50) not null,
 `class_id` int(50) not null,
 primary key (`id`)
) engine=myisam default charset=utf8 collate=utf8_unicode_ci auto_increment=5 ;
--
-- 导出表中的数据 `student`
--
insert into `student` (`id`, `name`, `dept`, `class`, `sex`, `dept_id`, `class_id`) values
(1, '计算机名字', '计算机工程系', '计061', '男', 1, 11),
(2, '教计名字', '计算机工程系', '教技061', '男', 1, 14),
(3, '管理名字', '管理系', '管理061', '女', 2, 21),
(4, '机械名字', '机械工程系', '自动化061', '男', 3, 31);

index.php代码:

<?php
$link=mysql_connect("localhost","root","") or die("数据库服务器连接错误".mysql_error());
mysql_select_db("student",$link) or die("数据库访问错误".mysql_error());
mysql_query("set character set gb2312");
mysql_query("set names gb2312");
?>
<html>
 <head>
 <title>下拉框连动</title>
 </head>
<body>
<script language="javascript">
//二级菜单数组
var subcat = new array();
<?php
$i=0;
$sql="select * from student";
$query=mysql_query($sql,$link);
while($arr=mysql_fetch_array($query))
{
 echo "subcat[".$i++."] = new array('".$arr["dept_id"]."','".$arr["class"]."','".$arr["class_id"]."');\n";
}
?>
//三级菜单数组
var subcat2 = new array();
<?php
$i=0;
$sql="select * from student";
$query=mysql_query($sql,$link);
while($arr=mysql_fetch_array($query))
{
 echo "subcat2[".$i++."] = new array('".$arr["class_id"]."','".$arr["class"]."','".$arr["name"]."');\n";
}
?>
function changeselect1(locationid)
{
 document.form1.s2.length = 0;
 document.form1.s2.options[0] = new option('22请选择22','');
 for (i=0; i<subcat.length; i++)
 {
 if (subcat[i][0] == locationid)
 {
  document.form1.s2.options[document.form1.s2.length] = new option(subcat[i][1], subcat[i][2]);
 }
 }
}
function changeselect2(locationid)
{
 document.form1.s3.length = 0;
 document.form1.s3.options[0] = new option('33请选择33','');
 for (i=0; i<subcat2.length; i++)
 {
 if (subcat2[i][0] == locationid)
 {
  document.form1.s3.options[document.form1.s3.length] = new option(subcat2[i][2], subcat2[i][0]);
 }
 }
}
</script>三级联动演示:<br>
<form name="form1">
<select name="s1" onchange="changeselect1(this.value)">
<option>--请选择--</option>
<option value=1>计算机工程系</option>
<option value=2>管理系</option>
<option value=3>机械工程系</option>
</select>
<select name="s2" onchange="changeselect2(this.value)">
 <option>--请选择--</option>
</select>
<select name="s3">
 <option>--请选择--</option>
</select>
</form>
</body>
</html>

更多关于php相关内容感兴趣的读者可查看本站专题:《php+mysql数据库操作入门教程》、《php+mysqli数据库程序设计技巧总结》、《php面向对象程序设计入门教程》、《php数组(array)操作技巧大全》、《php字符串(string)用法总结》及《php常见数据库操作技巧汇总

希望本文所述对大家php程序设计有所帮助。