原生js实现省市区三级联动插件

mumumu 发布于2019-08-26 11:43 / 662人阅读

原生js实现省市区三级联动插件 前言

插件功能只满足我司业务需求，如果希望有更多功能的，可在下方留言，我尽量扩展！如果你有需要或者喜欢的话，可以给我github来个star ?

仓库地址

在线预览

准备

// 页面上先引入css与js文件

页面中的容器标签不限制，只需给个id就行

var address = new Address({
    wrapId: "wrap",
    showArr: ["provinces","citys","areas"],
    beforeCreat:function(){
        console.log("beforeCreat")
    },
    afterCreat:function(){
        console.log("afterCreat");
    }
})

wrapId:"wrap" // 此处的wrap就是上面容器的id

showArr: ["provinces","citys","areas"] // 此处分别代表省、市、区容器的id

举个例子：如果传递的数组["provinces","citys","areas"]长度为3，那么将会出现省市区，数组中三个字符串分别是省、市、区容器的id

如传递的数组["provinces","citys"]长度为2，那么将会出现省市，数组中的两个字符串分别是省、市容器的id

如数组长度为1的时候就不说了

beforeCreat 插件开始创建前执行的回调函数

afterCreat 插件创建完成后执行的回调函数

预览

总结

如有什么功能需要增加的，可在评论区留言，我尽量满足。如有什么疏忽或错误，希望您指出。我会尽早修改，以免误导他人。

GPU云服务器云服务器 js省市县三级联动原生js三级联动省市三级联动陕西 ajax实现三级联动

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/107440.html

vue 省市区三级联动插件v-distpicker

摘要：十分便捷的三级联动插件官网步骤下载步骤使用与引入在中注册全局组件在文件中使用组件你需要用到三级联动的页面的里如何使用组件在该文件的部分写广东省广州市海珠区移动端步骤如何获取他们的数据给部分一个点击事件在配置十分便捷的三级联动插件官网：https://www.awesomes.cn/repo/... 步骤1：下载 npm install v-distpicker --save O...

learning 2019-08-23 18:02 评论0 收藏0
jquery移动端省市县（区）三级联动插件

摘要：写省市区三级联动插件的关键是在于你如何编写自己的省市县区文件，你要是把数据格式写对了，可以很轻松的写一省市区插件出来。最近刚做完一个版本的项目，闲暇时间，就索性把项目中需要用到的插件都自己写了一个，毕竟自己动手丰衣足食才是最重要，自己写的，可以应对各种项目需求，今天又把手机端的省市区三级联动选择功能编写了一个插件出来，代码很简单，样式也是应用的跟日期时间选择插件的一样。写省市区三级联...

Rocko 2019-08-01 17:35 评论0 收藏0
jquery移动端省市县（区）三级联动插件

摘要：写省市区三级联动插件的关键是在于你如何编写自己的省市县区文件，你要是把数据格式写对了，可以很轻松的写一省市区插件出来。最近刚做完一个版本的项目，闲暇时间，就索性把项目中需要用到的插件都自己写了一个，毕竟自己动手丰衣足食才是最重要，自己写的，可以应对各种项目需求，今天又把手机端的省市区三级联动选择功能编写了一个插件出来，代码很简单，样式也是应用的跟日期时间选择插件的一样。写省市区三级联...

spacewander 2019-08-21 16:22 评论0 收藏0
jquery移动端省市县（区）三级联动插件

摘要：写省市区三级联动插件的关键是在于你如何编写自己的省市县区文件，你要是把数据格式写对了，可以很轻松的写一省市区插件出来。最近刚做完一个版本的项目，闲暇时间，就索性把项目中需要用到的插件都自己写了一个，毕竟自己动手丰衣足食才是最重要，自己写的，可以应对各种项目需求，今天又把手机端的省市区三级联动选择功能编写了一个插件出来，代码很简单，样式也是应用的跟日期时间选择插件的一样。写省市区三级联...

Eric 2019-08-29 13:24 评论0 收藏0
vue项目中使用element-ui下拉框选项值为对象时报错

摘要：在做后台管理时，使用了搭配，请求方法使用了插件，在使用下拉框时，因为我需要获取选中的选项中的其他值，因此需要传入对象。在做后台管理时，使用了vue搭配elementUI，请求方法使用了axios插件，在使用下拉框时，因为我需要获取选中的选项中的其他值，因此需要传入对象。对select下拉框的文档没有读的很仔细，百度过几篇文章，也没有理解他们表达的意思，然后自己又去看文档，把他的属性看...

Drummor 2019-08-26 10:57 评论0 收藏0