前端 pickerview 的效果 实现 省市区 三级联动
2024-09-05 13:14:44
效果图
需要引入 大佬写的js 以及 css 源文件里面有大佬的地址
这是我存在gitee上的文件
https://gitee.com/depressiom/address-pickview-effect.git
<div class="weui-cells" style="margin: 0px;line-height: 60px;">
<div class="weui-cell weui-cell_select weui-cell_select-after clo_l">
<div class="weui-cell__hd">
<label class="weui-label clo_title">省/市/区</label>
</div>
<div class="weui-cell__bd">
<input class="weui-input clo_text" pattern="" type="text" @click="selectArea" id="selectArea" name="city" placeholder="请输入所在地区" v-model="areas" readonly>
</div>
</div>
</div>
// 选择地址
selectArea(){
// 地址三级联动
weui.picker(cityData3, {
//设置默认展示代码
defaultValue: ["110000", "110100", "110101"],
// 点击确定后
onConfirm: function (result) {
var str = "";
var cityArr = [];
result.map(function (i, val) {
str += i["label"] + ' '; // 获取文字
cityArr.push(i["value"]);
});
$("#selectArea").val(str);
areas = str ;
provinceCode = cityArr[0]; // 省级代码
cityCode = cityArr[1]; // 市级代码
areaCode = cityArr[2]; // 区县代码
$("#selectArea").attr("cityArr", cityArr);
}
})
},
很多时候都是站在巨人的肩膀上，很感谢搜索引擎上面的各种大佬 疑难解答
最新文章
- js的类型及调试下的辨识
- HashSet源码详解
- IOS安全测试
- java 关于多线程高并发方面
- BZOJ 1112: [POI2008]砖块Klo
- 分享一个在线生成站点地图SiteMap制作工具
- 分享一张SQLSERVER执行流程的图片
- （二）Protobuf的C#使用
- 【T-SQL系列】FOR XML PATH 语句的应用
- 玩耍Hibernate之缓存
- Cannot resolve the collation conflict between "SQL_Latin1_General_CP1_CI_AS" and "Latin1_General_100_CI_AS" in the equal to operation.
- CPU的ADDR2为什么跟SDRAM的0地址线接在一起
- MySQL存储过程事务处理
- tr转换或删除字符
- Qt标题栏图标和运行程序图标设置
- Logstash安装搭建（一）
- 最简单的基于FFmpeg的视频编码器-更新版（YUV编码为HEVC(H.265)）
- zabbix的api接口
- Codeforces 1065 简要题解
- 关于 Spring Security OAuth2 中 CORS 跨域问题