thinkPHP5下的省市区三级联动

浏览:4561 发布日期:2018/03/21 分类:ThinkPHP5专区 关键字: 三级联动 thinkphp5
省市区三级联动(地区数据库大家可以自己倒网上下载,这里就不上传了,只上传核心代码)

HTML代码:
<div class="box">
<select name="province" class="province"></select>
<select name="city" class="city"></select>
<select name="area" class="area"></select>
</div>

Jquery代码(需要引入jQuery):
<script>
/* 省市区三级联动 */
function privance() //省
{
$.post("{:url('privance')}", {param1: 'value1'}, function(data, textStatus, xhr) {
var html;
for (var i = 0; i<data.length; i++) {
html += "<option value='"+data[i]['provinceid']+"'>"+data[i]['province']+"</option>";
}
$('.province').html(html);
});
}
privance();

function city() //市
{
var provinceid = $('.province').val(); //省id
$.post("{:url('city')}", {provinceid: provinceid}, function(data, textStatus, xhr) {
var html;
for (var i = 0; i<data.length; i++) {
html += "<option value='"+data[i]['cityid']+"'>"+data[i]['city']+"</option>";
}
$('.city').html(html);
area();
});
}
city();

function area() //县
{
var cityid = $('.city').val(); //市id
//alert(cityid);
$.post("{:url('area')}", {cityid: cityid}, function(data, textStatus, xhr) {
var html;
for (var i = 0; i<data.length; i++) {
html += "<option value='"+data[i]['areaid']+"'>"+data[i]['area']+"</option>";
}
$('.area').html(html);
});
}
area();

$('.province').change(function(event) { //选择省
city();
});

$('.city').change(function(event) { //选择市
area();
});
/* 省市区三级联动 end */

</script>

PHP代码(用的是thinkphp5):
// 省市区三级联动------------
//读取省
public function privance()
{
$list = Db::name('provinces')->select();
return $list;
}

//读取市
public function city($provinceid)
{
if ($provinceid) {
$where = "provinceid=$provinceid";
} else {
$where = "provinceid=110000";
}
$list = Db::name('cities')->where($where)->select();
return $list;
}

//读取区
public function area($cityid)
{
if ($cityid) {
$where = "cityid=$cityid";
} else {
$where = "cityid=110100";
}
$list = Db::name('areas')->where($where)->select();
return $list;
}
//省市区三级联动结束---------------


最佳答案
评论( 相关
后面还有条评论,点击查看>>