首页 > Web开发 > 详细

jquery 城市三级选择器

时间:2019-08-28 15:31:27      阅读:69      评论:0      收藏:0      [点我收藏+]

header 文件的引入

<link rel="stylesheet" href="css/mui.min.css">
<link rel="stylesheet" href="css/mui.picker.css">
<link rel="stylesheet" href="css/mui.poppicker.css"/>

<script src="js/jquery-3.4.1.js" type="text/javascript" charset="utf-8"></script>
<script src="js/mui.js"></script>
<script src="js/update.js" type="text/javascript" charset="utf-8"></script>
<script src="js/mui.picker.js" type="text/javascript" charset="utf-8"></script>
<script src="js/mui.poppicker.js" type="text/javascript" charset="utf-8"></script>
<script src="js/city.data-3.js" type="text/javascript" charset="utf-8"></script>

HTML内容区域

<p class="box-top" >北京市 北京市 东城区</p>

jquery 部分

<script type="text/javascript">

// 选择省市区
var city_picker = new mui.PopPicker({layer:3});
city_picker.setData(cityData3);
$("#city_text").on("tap", function(){
city_picker.show(function(items){

// $("#city_id").val((items[0] || {}).value + "," + (items[1] || {}).value + "," + (items[2] || {}).value);//该ID为接收城市ID字段  自己不需要,就把他给删除了
$(".box-top").html((items[0] || {}).text + " " + (items[1] || {}).text + " " + (items[2] || {}).text);
});

});


</script>

 

补充内容:

自己在写城市三级联动选择是,出现了,没有对数据进行setdata()转存,所以研究了很长时间,

如果大家出现类似或其他问题,可以参考这篇文章:

https://www.jianshu.com/p/4f23396553c4 

jquery 城市三级选择器

原文:https://www.cnblogs.com/Progress-/p/11424242.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!