写一个省-市的联动点击省才显示市。都是用a标签的
HTML代码如下：
<!DOCTYPE html>
<html>
<head>
<title>省-市联动</title>
<style>
.city {
display: none;
}
</style>
</head>
<body>
<div>
<a href="#" onclick="showCities('province1')">省1</a>
<a href="#" onclick="showCities('province2')">省2</a>
<a href="#" onclick="showCities('province3')">省3</a>
</div>
<div id="province1" class="city">
<a href="#">市1</a>
<a href="#">市2</a>
<a href="#">市3</a>
</div>
<div id="province2" class="city">
<a href="#">市4</a>
<a href="#">市5</a>
<a href="#">市6</a>
</div>
<div id="province3" class="city">
<a href="#">市7</a>
<a href="#">市8</a>
<a href="#">市9</a>
</div>
<script>
function showCities(province) {
var cities = document.getElementsByClassName("city");
for (var i = 0; i < cities.length; i++) {
cities[i].style.display = "none";
}
var provinceDiv = document.getElementById(province);
provinceDiv.style.display = "block";
}
</script>
</body>
</html>
在上述代码中，使用了CSS的display: none;样式来隐藏市的选项。通过点击省的<a>标签，调用JavaScript函数showCities()来显示对应的市选项。其中，showCities()函数首先隐藏所有市的选项，然后根据传入的省参数显示对应的市选项
原文地址: https://www.cveoy.top/t/topic/hL4w 著作权归作者所有。请勿转载和采集!