Java 下拉框带搜索功能（检索）

---------------------js

$(document).ready(function() {
    $.ajax({
        type: 'post',
        url: "${ctx}/order/order/getResName",
        cache: false,
        dataType: 'json',//通过json格式返回
        success: function(res){
        document.getElementById("mySelect").innerHTML = "";
            for (var i = 0; i < res.length; i++) {
                var optionElement = document.createElement("option");
                // 根据具体情况设置每个选项的值和显示文本
                optionElement.value = res[i].name;//name为后台SQL语句查询出结果
                optionElement.textContent = res[i].name;
                // 将选项添加到下拉列表中s
                document.getElementById("mySelect").appendChild(optionElement);
           }
        },
        error: function(err){
            console.log(err)
            return;
        }
    });
    
});

---------------------------------- input

input的list和datalist的ID对应class可以根据你自己的项目框架修改。

<input type="text" class="weui-input required"  id="dp" name = "dp" list="mySelect" style="border:0px;"  placeholder="请输入内容">
                        <datalist id= "mySelect">
                            <option  style="color:#dbdbdb;"></option> 
                        </datalist>

----------------------------------java

    url: "${ctx}/order/order/getResName",（js的url）

直接返回List<实体类>或List<String> 即可;返回类型还有其他写法，随意。

-----------------------缺点

我暂时还没找到将option赋值为id时，页面显示name的方法，现只能都赋值为name.