省市区镇（可以选四级）联动点击自动展开下一级

最新推荐文章于 2020-06-30 09:06:59 发布

寓言s

最新推荐文章于 2020-06-30 09:06:59 发布

阅读量1.5w

点赞数 2

分类专栏： javascript

本文链接：https://blog.csdn.net/u011551941/article/details/46786497

版权

周末在家的时候，接到后端的一个电话，说领导有这个这样的需求。刚开始我理解错了。以为需要做一个省市区三级联动的，稀里哗啦的在网上找了数据。然后谢了出来。结果沟通才知道。需求理解错了，需要电商网站填写个人收货地址的需求。简化用户点击次数，选择完省，市自动出来，选择市，县自动出来，接着再如果需要四级联动，就单独封装函数AJAX四级城镇请求出来：

代码为：

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="renderer" content="webkit">
    <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
    <title>Document</title>
    <style>
        *{margin:0;padding:0}li{list-style-type:none}body{margin:0 auto;max-width:720px}.panle{position:fixed;top:0;height:100%;max-width:720px;width:100%;display:none}.panle1,.panle2,.panle3,.panle4{background:#fff;width:100%;margin:auto;text-align:center;height:100%;display:none}.panle p{text-align:center;position:relative;width:100%