分享一个layui框架省市区下拉框三级联动插件

写在前面

在使用layui框架的时候，经常会有很多插件的使用问题，比如说下拉框的省市区三级联动，因为项目的需求不同或者插件的的使用问题，经常会出现下拉框取不到值或者后台提交不上数据之类的问题，实在让人头疼。在这里给大家分享一个插件，亲测实用。

使用方法

引用layui.css和layui.js
引用jq.js
引用assets文件下的data.js(省市区数据)和province.js(方法文件)

js代码

 <script type="text/javascript">
        var defaults = {
            s1: 'provid',
            s2: 'cityid',
            s3: 'areaid',
            v1: null,
            v2: null,
            v3: null
        };
 
    </script>

HTML代码

<div style="width:800px;margin:50px auto;">
        <form class="layui-form">
            <div class="layui-form-item">
                <label class="layui-form-label">选择地区</label>
                <div class="layui-input-inline">
                    <select name="provid" id="provid" lay-filter="provid">
                        <option value="">请选择省</option>
                    </select>
                </div>
                <div class="layui-input-inline">
                    <select name="cityid" id="cityid" lay-filter="cityid">
                        <option value="">请选择市</option>
                    </select>
                </div>
                <div class="layui-input-inline">
                    <select name="areaid" id="areaid" lay-filter="areaid">
                        <option value="">请选择县/区</option>
                    </select>
                </div>
            </div>
        </form>
    </div>

效果图

更多关于layui框架啊省市区三级联动的问题，请移步到：

社区里有一个帖子不错，大家可以去参考参考：