省市区级联
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="js/vue.js" type="text/javascript" charset="utf-8"></script> </head> <body> <div id="app"> <select v-model="sheng"> <option v-for="sheng in shengList">{{sheng}}</option> </select> <select v-model="city"> <option v-for="city in cityList">{{city}}</option> </select> <select v-model="area"> <option v-for="area in areaList">{{area}}</option> </select> </div> <!-- <script type="text/javascript" src="js/jilian.js"></script> --> <script type="text/javascript"> var shengArray= ["江苏省","湖北省", "湖南省"]; var cityArray=["南京市", "苏州市","无锡市"]; var areaArray=["鼓楼区", "秦淮区","江宁区"]; new Vue({ el: "#app", data: { sheng: shengArray[0], shengList: shengArray, city: cityArray[0], cityList: cityArray, area: areaArray[0], areaList: areaArray }, watch: { sheng() { if (this.sheng == "湖北省") { this.cityList = ["武汉市", "黄石市"]; } else if (this.sheng == "湖南省") { this.cityList = ["岳阳市", "长沙市"]; } else if (this.sheng == "江苏省") { this.cityList = ["南京市", "苏州市","无锡市"]; } this.city = this.cityList[0]; }, city() { if (this.city == "武汉市") { this.areaList = ["江汉区", "江夏区"]; } else if (this.city == "黄石市") { this.areaList = ["上窑区", "下窑区"]; } else if (this.city == "岳阳市") { this.areaList = ["岳阳楼区", "君山区"]; } else if (this.city == "长沙市") { this.areaList = ["天心区", "开福区"]; } else if (this.city == "南京市") { this.areaList = ["鼓楼区", "秦淮区","江宁区"]; } else if (this.city == "苏州市") { this.areaList = ["姑苏区", "吴中区","相城区"]; }else if (this.city == "无锡市") { this.areaList = ["梁溪区", "滨湖区","惠山区"]; } this.area = this.areaList[0]; } } }); </script> </body> </html>
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 25岁的心里话
· 闲置电脑爆改个人服务器（超详细） #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目（很简单哒）
· 零经验选手，Compose 一天开发一款小游戏！
· AI Agent开发，如何调用三方的API Function，是通过提示词来发起调用的吗