mui的省市区的三级联动改编分级弹出选择

最新推荐文章于 2022-07-20 15:47:41 发布

h5liangliang

最新推荐文章于 2022-07-20 15:47:41 发布

阅读量3.8k

点赞数 1

文章标签：微信 app 通用

本文链接：https://blog.youkuaiyun.com/h5liangliang/article/details/78063495

版权

该博客详细介绍了如何利用mui库实现移动端的省市区三级联动选择功能。通过调用接口获取数据，创建并更新PopPicker组件，实现从省到市再到区的逐级选择，并在选择过程中更新对应的显示内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

huilianUtils.callApi('Survey/ProvinceByCode', null,
function(data) {
var userPicker = new jQuery.PopPicker();
userPicker.setData(data.data);
var showUserPickerButton = doc.getElementById('space');
var userResult = doc.getElementById('space');
var usertc=doc.getElementById('category');
var userta=doc.getElementById('model');
var usertz=doc.getElementById('area');
showUserPickerButton.removeEventListener('tap',function(){},false);
showUserPickerButton.addEventListener('tap', function(event) {
document.getElementById('comfirm').style.backgroundColor='gray';
document.getElementById('tradeWay1').style.display='none';
document.getElementById('tradeWay').style.display='none';
document.getElementById('aa').style.display='none';
// document.getElementById('category').innerHTML='请选择所在市';
// document.getElementById('#comfirm').style.backgroundColor='#000000';
userPicker.show(function(items) {
userResult.innerHTML = items[0].display;
usertc.innerHTML='请选择所在市';
userta.innerHTML="请选择所在区";
usertz.innerHTML="请选择所在镇";

category_id = items[0].code;
// console.log(category_id)
//返回 false 可以阻止选择框的关闭
//return false;
categorytap();