在网站开发时,经常会用到省市县的联动菜单。营业的场景有用户注册时用户的地址,以及用户详细资料页面。有的时候,把某个地区作为查询或者筛选条件时也会用到联动菜单。
作为网站开发人家,省市县联动菜单是必须掌握的本领。
问题1:全国34个省,几百个地级市,几千个县级单位如果全部枚举的话,很累,代码也很多,开发起来也比较慢。理想的做法,也是大家都采用的做法就是 把这些数据存到数据库里面,然后调取数据库中的数据,这样开发和维护起来都比较方便。
问题2: 怎么样让联动起来,比如查询河南省,下级菜单只显示河南省的,而不是所有省的地级市。县级也一样。这就需要 ajax 技术来实现了。
代码如下:
1、 index.php
$conn=mysql_connect("localhost","root","111");//链接数据库
mysql_select_db("novel");//选择数据库
mysql_query("set names 'utf8'");//设定字符集
?>
请选择省份 $sql="SELECT * FROM web_cascadedata WHERE datagroup='area' AND level=0 ORDER BY orderid ASC, datavalue ASC"; $result=mysql_query($sql);//执行语句赋值给变量 while($row=mysql_fetch_array($result)){ echo ''.$row['dataname'].''; } ?>
市/地区/自治州
县/市/区
2、 data.php 用于接受和处理 下列菜单的动态数据
$conn=mysql_connect("localhost","root","111");//链接数据库
mysql_select_db("novel");//选择数据库
mysql_query("set names 'utf8'");//设定字符集
//获取级联
$a=isset($_GET['a']) ? $_GET['a'] : "";
if($a == 'getarea')
{
//初始化参数
$datagroup = isset($_GET['datagroup']) ? $_GET['datagroup'] : '';
$level = isset($_GET['level']) ? intval($_GET['level']) : '';
$v = isset($_GET['areaval']) ? $_GET['areaval'] : '0';
$str = '
市/地区/自治州';
$sql = "SELECT * FROM `web_cascadedata` WHERE `level`=$level And ";
if($v == 0)
$sql .= "datagroup='$datagroup'";
else if($v % 500 == 0)
$sql .= "`datagroup`='$datagroup' AND `datavalue`>'$v' AND `datavalue`
else
$sql .= "`datavalue` LIKE '$v.%%%' AND `datagroup`='$datagroup'";
$sql .= " ORDER BY orderid ASC, datavalue ASC";
$res=mysql_query($sql);
while($row=mysql_fetch_array($res))
{
$str .= '
'.$row['dataname'].'';
}
if($str == '') $str .= '
县/市/区';
echo $str;
exit();
}
?>
3、 js.js 用脚本技术post ajax请求到 data,并获取返回值
/*
* 级联获取城市
*
* @access public
* @val string 选择的省枚举值
* @input string 返回的select
* @return string 返回的option
*/
function SelProv(val,input)
{
$("#"+input+"_country").html("
--");
$.ajax({
url : "data.php?a=getarea&datagroup=area&level=1&areaval="+val,
type:'get',
dataType:'html',
success:function(data){
$("#"+input+"_city").html(data);
}
});
}
/*
* 级联选择区县
*
* @access public
* @val string 选择的市枚举值
* @input string 返回的select
* @return string 返回的option
*/
function SelCity(val,input)
{
$.ajax({
url : "data.php?a=getarea&datagroup=area&level=2&areaval="+val,
type:'get',
dataType:'html',
success:function(data){
$("#"+input+"_country").html(data);
}
});
}
本站关键词:省市 菜单