快捷導(dǎo)航

PHP+mysql實(shí)現(xiàn)的三級(jí)聯(lián)動(dòng)菜單功能示例

更新時(shí)間：2019年02月15日 12:05:31 作者：ybhjx

這篇文章主要介紹了PHP+mysql實(shí)現(xiàn)的三級(jí)聯(lián)動(dòng)菜單功能,涉及mysql數(shù)據(jù)庫創(chuàng)建、數(shù)據(jù)添加及php讀取mysql、創(chuàng)建聯(lián)動(dòng)菜單相關(guān)操作技巧,需要的朋友可以參考下

本文實(shí)例講述了PHP+mysql實(shí)現(xiàn)的三級(jí)聯(lián)動(dòng)菜單功能。分享給大家供大家參考，具體如下：

數(shù)據(jù)庫mysql

-- 數(shù)據(jù)庫: `student`
--
-- --------------------------------------------------------
--
-- 表的結(jié)構(gòu) `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 ;
--
-- 導(dǎo)出表中的數(shù)據(jù) `student`
--
INSERT INTO `student` (`id`, `name`, `dept`, `class`, `sex`, `dept_id`, `class_id`) VALUES
(1, '計(jì)算機(jī)名字', '計(jì)算機(jī)工程系', '計(jì)061', '男', 1, 11),
(2, '教計(jì)名字', '計(jì)算機(jī)工程系', '教技061', '男', 1, 14),
(3, '管理名字', '管理系', '管理061', '女', 2, 21),
(4, '機(jī)械名字', '機(jī)械工程系', '自動(dòng)化061', '男', 3, 31);

index.php代碼：

<?php
$link=mysql_connect("localhost","root","") or die("數(shù)據(jù)庫服務(wù)器連接錯(cuò)誤".mysql_error());
mysql_select_db("student",$link) or die("數(shù)據(jù)庫訪問錯(cuò)誤".mysql_error());
mysql_query("set character set gb2312");
mysql_query("set names gb2312");
?>
<html>
 <head>
 <title>下拉框連動(dòng)</title>
 </head>
<body>
<script language="JavaScript">
//二級(jí)菜單數(shù)組
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";
}
?>
//三級(jí)菜單數(shù)組
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>三級(jí)聯(lián)動(dòng)演示：<BR>
<form name="form1">
<select name="s1" onChange="changeselect1(this.value)">
<option>--請選擇--</option>
<option value=1>計(jì)算機(jī)工程系</option>
<option value=2>管理系</option>
<option value=3>機(jī)械工程系</option>
</select>
<select name="s2" onChange="changeselect2(this.value)">
 <option>--請選擇--</option>
</select>
<select name="s3">
 <option>--請選擇--</option>
</select>
</form>
</body>
</html>

更多關(guān)于PHP相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《php+mysql數(shù)據(jù)庫操作入門教程》、《php+mysqli數(shù)據(jù)庫程序設(shè)計(jì)技巧總結(jié)》、《php面向?qū)ο蟪绦蛟O(shè)計(jì)入門教程》、《PHP數(shù)組(Array)操作技巧大全》、《php字符串(string)用法總結(jié)》及《php常見數(shù)據(jù)庫操作技巧匯總》

希望本文所述對(duì)大家PHP程序設(shè)計(jì)有所幫助。

您可能感興趣的文章: