php和javascript实现二级联动下拉菜单

最新推荐文章于 2021-03-28 12:08:07 发布

weixin_34342207

最新推荐文章于 2021-03-28 12:08:07 发布

阅读量102

点赞数

文章标签： php javascript 数据库 ViewUI

原文链接：http://www.cnblogs.com/zhezh/archive/2013/04/13/3773553.html

版权

数据库test
保存省的数据表province：id,p_name;
保存市的数据表city：id,p_id(对应的省的名字),c_name;
===============================分割线=====================
程序原理：
首先用php语句，把省份的信息都取出来放到一个数组$forum_data[]中，然后把市的信息放到另外一个数组$forum_data2[]中。
因为市的详细信息需要在js中调用，所以在js中写一个二维数组subcat2用来保存所有的市的信息（包括id以及对应的省的id还有对市的名字）。然后在js中定义一个函数 changelocation，在省的那个select中定义一个事件onChange="changelocation(document.myform.bigClass.options[document.myform.bigClass.selectedIndex].value)"，把选中的省的id传到函数changelocation中，然后函数根据省的id与二维数组subcat2中的p_id对照，然后生成对应的城市的option。
=================================分割线===================
代码如下：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>全动态二级联动下拉列表</title>
</head>
<body>
	<?
	    //连接数据库
		$link = mysql_connect("localhost", "root", "")
		   or die("Could not connect : " . mysql_error());
		mysql_select_db("test") or die("Could not select database");
		mysql_query("SET NAMES GBK");
        //获取所有的省份的信息
		$sqlSel = "select * from province order by id ";
		$result = mysql_query($sqlSel) or die("Query failed : " . mysql_error());
		
		$forum_data = array();
		while( ($row = mysql_fetch_array($result))!=false )
		{
			   $forum_data[] = $row;
		}

		mysql_free_result($result);
		//获取所有的市的信息
		$sqlSel2 = "select * from city order by p_id desc";
		
		if( !($result2 = mysql_query($sqlSel2)) )
		{
			die ( 'Could not query t_city list' );
		}
		
		$forum_data2 = array();
		while( ($row2 = mysql_fetch_array($result2))!=false )
		{
			   $forum_data2[] = $row2;
		}
		
		mysql_free_result($result2);
	?>
	<!-- js实现获取 省份的信息进而生成所有的市-->
	<script language="JavaScript">
	var onecount2;
	subcat2 = new Array();
	<?php
		$num2 = count($forum_data2);
	?>
	onecount2=<?php echo $num2;?>;
	<?
		for($j=0;$j<$num2;$j++)
		{
	?>
     //用subcat2保存所有的市的信息
			subcat2[<? echo $j;?>] = new Array("<? echo $forum_data2[$j]['id'];?>","<? echo $forum_data2[$j]['p_id'];?>","<? echo $forum_data2[$j]['c_name'];?>");
	<?  
	    }
	?>
	//获取省份的id然后进而生成对应的市的下拉框
		function changelocation(id)
		{
			document.myform.city.length = 0;
			var id=id;
			var j;
			document.myform.city.options[0] = new Option('==选择城市==','');
			for (j=0;j < onecount2; j++)
			{
				if (subcat2[j][1] == id)
				   {
					   document.myform.city.options[document.myform.city.length] = new Option(subcat2[j][2], subcat2[j][0]);
				   }
			}
		}
	</script>
	
	<form name="myform" method="post">
	
	地址：	<select name="bigClass" onChange="changelocation(document.myform.bigClass.options[document.myform.bigClass.selectedIndex].value)"size="1">
		
		<option selected>请选择省份</option>
		  
		<?php
			$num = count($forum_data);
			
			for($i=0;$i<$num;$i++)
			{
		?>
				<option value="<?echo $forum_data[$i]['id'];?>"><?echo $forum_data[$i]['p_name'];?></option>
		<?
			}
		?>
		</select> 
		<SELECT name=city size=1 id="city">
			<option selected value="">==选择城市==</option>
		</select>
	</form>
</body>
</html>

转载于:https://www.cnblogs.com/zhezh/archive/2013/04/13/3773553.html

weixin_34342207

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
php和javascript实现二级联动下拉菜单

数据库test保存省的数据表province：id,p_name;保存市的数据表city：id,p_id(对应的省的名字),c_name;===============================分割线=====================程序原理：首先用php语句，把省份的信息都取出来放到一个数组$forum_data[]中，然后把市的信息放到另外一个数组$f...
复制链接

扫一扫