前端省市区三级联动

最新推荐文章于 2024-01-13 09:08:58 发布

小芒果咩咩

最新推荐文章于 2024-01-13 09:08:58 发布

阅读量558

点赞数

文章标签：前端 javascript html

本文链接：https://blog.csdn.net/qq_42430038/article/details/126364388

版权

本文介绍了如何在前端使用JavaScript和HTML实现省市区三级联动的效果，包括js的引入、CSS样式和HTML结构的详细说明。

摘要由CSDN通过智能技术生成

1.引入js部分

<script src="__PUBLIC__/static/js/city.js"></script>

（详情见city.js_小芒果咩咩的博客-CSDN博客）

var addrShow = document.getElementById('addr-show');
var btn = document.getElementsByClassName('met1')[0];
var prov = document.getElementById('prov');
var city = document.getElementById('city');
var country = document.getElementById('country');
 
 
/*用于保存当前所选的省市区*/
var current = {
    prov: '',
    city: '',
    country: ''
};
 
/*自动加载省份列表*/
(function showProv() {
    // btn.disabled = true;
    var len = provice.length;
    for (var i = 0; i < len; i++) {
        var provOpt = document.createElement('option&