distpicker.js 三级联动，修改地址时设置默认值

最新推荐文章于 2024-03-25 09:32:42 发布

weixin_38247148

最新推荐文章于 2024-03-25 09:32:42 发布

阅读量3k

点赞数 1

CC 4.0 BY-SA版权

文章标签： distpicker 三级联动

本文链接：https://blog.youkuaiyun.com/weixin_38247148/article/details/88360358

本文分享了使用JavaScript实现三级联动选择器的经验，详细介绍了如何通过遍历、触发事件和设置option的selected属性来实现省市区的选择功能。

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

做java 后台的，半路出家，想做个自己的商城，卖点东西想着挣点外快，用到了js的三级联动，在网上找了很多，没找到解决的方法。只能想办法自己解决，想着留个备份，所以处女做作给js 啦~~主要考虑遍历、触发事件和设置option的selected 属性。言归正传以下是代码

html

js:

下面这个不知道为什么必须要加否则不会百分百复现，至于原因还没找到，有大神请指点一下

$("#address").distpicker('destory');
   $("#address").distpicker({
       province: province1,
   // Defines the initial value of city.
   city: city1,
   // Defines the initial value of district.
   district: district1
   });

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

下面是默认值的实现province1 city1  district1 这三个值为后台传入
   $("#receiverState").find("[data-text="+province1+"]").attr("selected",true);
   $("#receiverState").trigger("change");
   $("#receiverCity").find("[data-text="+city1+"]").attr("selected",true);
   $("#receiverCity").trigger("change");
   $("#receiverDistrict").find("[data-text="+district1+"]").attr("selected",true);

完