layui下拉多远

Posted 2023-04-02

参考技术A Layui下拉框可以支持到多远的距离取决于你的页面布局，它的最小尺寸设置为一个宽度为200px的div，而最大尺寸可以自定义，只要不超过页面的宽度就可以。此外，layui下拉框可以支持动态加载，可以从服务器加载数据，它还支持搜索，可以自定义搜索函数和过滤函数，还可以自定义下拉框的样式，可以使用CSS来自定义下拉框的外观。

Layui__下拉框layui下拉框默认选中其中的一项

话不多说，上代码

    window.onload = function () {
        var HallNameId = $("#HallNameId").val();
        //console.log(HallNameId);
        var select = ‘dd[lay-value=‘ + HallNameId + ‘]‘;
        $(‘#hallName‘).siblings("div.layui-form-select").find(‘dl‘).find(select).click();
    }

layui在select标签中，会被渲染为dd列表，此时，我们赋值select标签已无太大的意义，需要对dd列表中的值设置选中

    <div class="layui-form-item">
        <label class="layui-form-label">选项</label>
        <div class="layui-inline layui-show-xs-block">
            <select id="hallName" name="hallName" lay-filter="hallName">
                <option value="1">请选择</option>
                <option value="1">测试1</option>
                <option value="1">测试2</option>
                <option value="1">测试3</option>

            </select>
            <div class="layui-unselect layui-form-select">
                <div class="layui-select-title">
                    <input type="text" placeholder="请选择" value="请选择" readonly="" class="layui-input layui-unselect">
                    <i class="layui-edge" />
                </div>
                <dl class="layui-anim layui-anim-upbit">
                    <dd lay-value="1" class="layui-this">请选择</dd>
                    <dd lay-value="1" class="layui-this">测试1</dd>
                    <dd lay-value="1" class="layui-this">测试2</dd>
                    <dd lay-value="1" class="layui-this">测试3</dd>
                </dl>
            </div>
        </div>
    </div>