原生js实现省市区三级联动代码分享

这篇文章主要介绍了如何使用原生JavaScript实现省市区三级联动功能，并且提供了相关的代码分享。对于需要实现这一功能的朋友，可以参考学习。

前言

此插件功能为我司业务需求定制，如有更多需求，欢迎在评论区留言，我会尽量扩展功能。如果你喜欢的话，欢迎在我的GitHub上点个star。

准备

我们在页面中准备一个容器，比如一个div标签，只需要给它一个id即可。例如，这里的id为"wrap"。

接下来，我们通过一段JavaScript代码来实现省市区三级联动功能。我们创建一个名为Address的对象，并传入一些必要的参数。

例如：

```javascript

var address = new Address({

wrapId: 'wrap',

showArr: ['provinces', 'citys', 'areas'],

beforeCreat: function() {

console.log("beforeCreat");

},

afterCreat: function() {

console.log('afterCreat');

}

});

```

参数说明：

wrapId："wrap"，这是我们在页面中准备的容器的id。

showArr：这是一个数组，代表省、市、区容器的id。数组的长度决定了联动级别。例如，如果数组长度为3，则会出现省、市、区三级联动；如果数组长度为2，则会出现省、市二级联动。

beforeCreat和afterCreat是插件创建前后的回调函数，可以在其中添加自定义逻辑。

预览

在实际使用中，你可以根据需求调整参数和样式，实现符合自己业务需求的省市区三级联动功能。

如有任何功能需求或问题，欢迎在评论区留言，我会尽快回复并改进。也欢迎指出任何疏忽或错误，以便我能及时修改，避免误导他人。

调用cambrian.render('body')来渲染插件到页面中。

希望这篇文章和代码能帮助到你。如果你有任何疑问或需要进一步的解释，请随时联系我。