前提： 已引入layui
官网：

https://www.layui.com/doc/

html

<div class="layui-input-inline">
    <select name="sel" lay-filter="sel" id="sel">
    	<option value = ''>请选择</option>
    	<option value = '1'>选择1</option>
    	<option value = '2'>选择2</option>
    </select>
</div>

js

layui.use(['form'], function () {
	let form = layui.form;
	form.render('select'); // 动态渲染layui select
	form.on('select(sel)',function () { // layui select下拉监听
		let selData = $('#select2').val()
	}
});

以php语言为例

html

<div class="layui-form-item layui-row layui-col-space15">
   <label class="layui-col-xs3 relative">
        <span class="color-green">报考学校</span>
        <select class="layui-select" required name="school_id" lay-search lay-filter="school_id">
        	{php}
				$schools = Db::name('School')
					->where(['pid' => '0'])
					->field('id,title')
					->order('sort desc,id desc')
					->select();
			{/php}
            {foreach $schools as $k=>$v}
            <!--{eq name='v.id' value='$vo.school_id|default=0'}-->
            <option selected value="{$v.id}">{$v.title}</option>
            <!--{else}-->
            <option value="{$v.id}">{$v.title}</option>
            <!--{/eq}-->
            {/foreach}
        </select>
    </label>
    <label class="layui-col-xs3 relative">
        <span class="color-green">层次</span>
        <select name="level_id" lay-filter="level_id" id="two_cate" required>
        </select>
    </label>
</div>

jq代码

<script>
    window.form.render();
    
    //初始化渲染
    $(function(){
        $value = $('select[name="school_id"]').val();
        school_select($value);
    })

    //学校层次二级联动
    form.on('select(school_id)', function(data){
        //data.value 得到被选中的值
        school_select(data.value);
    });
    
    function school_select(value){
        var url = '{:url("student/wxapp_product/getLevels")}?id=' + value;
        $.get(url,function(data){
            $("#two_cate").empty();
            $("#two_cate").append(new Option("请选择层次", ""));
            $.each(data.data,function(index,item){
                if(item.id == '{$vo.level_id|default=0}'){
                    $("#two_cate").append(new Option(item.title, item.id, true, true));
                }else{
                    $("#two_cate").append(new Option(item.title,item.id));
                }
            });
            layui.form.render("select");
        });
    }
    
</script>

php代码

/**
  * 按学校id获取层级
  * @param boolean $result
  */
 public function getLevels()
 {
     $levels = Db::name('School')
     ->where(['pid' => request()->get('id')])
     ->field('id,title,major')
     ->order('sort desc,id desc')
     ->select();
     $this->success('获取成功', $levels);
 }

效果

另外

//指定选中某个值
$('select[name="jobs"] option[value="0"]').attr("selected", true);
//获取选中选项中的某个值
$("select[name='ware_house_id']").find("option:selected").data('income_tuan_price');
$("select[name='ware_house_id'] option:selected").data('income_tuan_price');

如果您觉得本篇对你有帮助,可以点关注,给个赞,支持一下,过程有遇到什么问题也欢迎评论私信,进行交流

使用layui的Select的下拉的时候，带有特殊字符，选中的内容变成转义HTML，
例如下图，选中R&D时，text内容自动变成R&D


解决方法
找到From.js，查找 t(p[0].options[a]).html()

改为 t(p[0].options[a]).text()

问题得以解决。