layarea实现省市区三级联动修改默认值

问题描述

我在使用layarea实现三级联动时,默认值总是北京市,我想要的默认值是 请选择,如果你想要默认的值是其他省市,可以通过data-value来指定,如以下代码:

<div class="layui-form-item" id="area-picker">
    <div class="layui-form-label">地区</div>
    <div class="layui-input-inline" style="width: 200px;">
        <select name="province" class="province-selector" data-value="上海市" lay-filter="province-1">
            <option value="" >请选择省</option>
        </select>
    </div>
    <div class="layui-input-inline" style="width: 200px;">
        <select name="city" class="city-selector" data-value="上海市" lay-filter="city-1">
            <option value="" >请选择市</option>
        </select>
    </div>
    <div class="layui-input-inline" style="width: 200px;">
        <select name="county" class="county-selector" data-value="黄浦区" lay-filter="county-1">
            <option value="" >请选择区</option>
        </select>
    </div>
</div>

或者通过JS来修改

// 渲染三级联动
        layarea.render({
    
    
            elem: '#area-picker',
            data: {
    
    
                province: '上海市',
                city: '上海市',
                county: '黄浦区'
            },
            change: function (res) {
    
    
                //选择结果
                console.log(res);
            }
        });

设置默认值为“请选择”

我是通过修改layarea.js源代码来解决的。在layarea.js的省列表、市列表、区列表分别添加如下红色方框代码即可。

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

贴个效果图

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_47768542/article/details/113555976