jquery+ajax实现省市区三级联动 （封装和不封装两种方式）
|
首先，要实现如下图效果，
1、要理清思路： 先做出三个下拉菜单----根据第一个下拉菜单的value值获取第二个下拉列表的内容，第三个同理。 2、用到的数据库表：Chinastates表
规律：根据国家级（中国）的areacode查询省级(如：北京) ; 根据省级的areacode查询市级（如：北京市辖）；根据市级的areacode查询区级（如东城区） 第一种方式：没有用到封装，数据读取较慢，可以看看原理，这样在第二种方式封装时就容易多了。代码如下： 期间出现的问题：每个下拉列表的第一个数据输不出来：是因为每个下拉列表的第一个数据的value值都带有空格！！！所以在输出data时要去空格！！！ data返回的值可能带有空格换行等，所以要用trim()方法去空格！！！ 第二种方式：封装成插件，以后可以随时调用（重要）（1）主页面： //引入jquery包 //id要与封装的js插件中一致 （2）我们自己封装的js插件 ");
//加载省的数据
LoadSheng();
//加载市的数据
LoadShi();
//加载区的数据
LoadQu();
//给省的下拉列表添加点击事件，当省变化时，对应的市和区会发生变化
$("#sheng").click(function(){
LoadShi();
LoadQu();
})
//给市的下拉列表添加点击事件，当市变化时，对应的区发生变化
$("#shi").click(function(){
LoadQu();
})
}); //加载省的下拉列表 //加载市省的下拉列表 //加载省的下拉列表 其次就是处理页面(两种方法都用到的)：chuli.php strquery($sql);
echo $str;
最后就是封装的类文件：DB.class.php host,$this->uid,$this->pwd,$this->dbname);
$result = $db ->query($sql);
$arr =$result->fetch_all();
$str="";
foreach($arr as $v)
{
$str=$str.implode("^",$v)."|";
}
$str = substr($str,strlen($str)-1);
return $str;
}
}
?>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
