一、html部分
<div class="form-group"> <select name="depart" id="depart" class="form-control"> @foreach($departs as $item) <option value="{{$item->id}}">{{$item->depart_name}}</option> @endforeach <input type="text" hidden id="depart_id"> </select> </div>
二、JS引入
<link rel="stylesheet" href="{{asset('lib/jquery.editable-select/jquery-editable-select.min.css')}}"> <script src="{{asset('lib/jquery.editable-select/jquery-editable-select.min.js')}}"></script>
三、声明
//带输入框的下拉框 $("#depart").editableSelect({ filter: true, //bg_iframe:true, //effects: 'fade', case_sensitive: false, }).on("select.editable-select", function (e, li) { var dataValue = li.attr("data-value"); $("#depart_id").val(li.val()); }); $("#depart").prop("placeholder", "==请输入或选择科室==");
文件下载地址:链接:https://pan.baidu.com/s/17C8brjcA3sfeivKW4Fh2TQ
提取码:altw
https://github.com/indrimuska/jquery-editable-select