Html 引导4输入下拉列表。怎么用?

Html 引导4输入下拉列表。怎么用?,html,css,bootstrap-4,Html,Css,Bootstrap 4,下面是一个按钮下拉列表的示例我使用材质图标和谷歌机器人单色字体进行了定制,该字体非常适合间距。我的问题是,我如何才能获得一个输入,使其以同样的方式工作 双箭头 下拉列表1 进一步扩展 好的。所以,在多付了一点钱之后,我想出了这个解决方案。知道如何摆脱在筛选过程中隐藏了各自链接的下拉分隔符,这将是一件好事 //列表过滤器 $(文档).ready(函数(){ //在键盘上。。。 $(“#input ext9”)。在(“keyup”,function()上{ //目前还没有发现任何结果 让结果_

下面是一个按钮下拉列表的示例我使用材质图标和谷歌机器人单色字体进行了定制,该字体非常适合间距。我的问题是,我如何才能获得一个输入,使其以同样的方式工作


双箭头
下拉列表1
进一步扩展

好的。所以,在多付了一点钱之后,我想出了这个解决方案。知道如何摆脱在筛选过程中隐藏了各自链接的下拉分隔符,这将是一件好事

//列表过滤器
$(文档).ready(函数(){
//在键盘上。。。
$(“#input ext9”)。在(“keyup”,function()上{
//目前还没有发现任何结果
让结果_found=false;
//所有键入的值都是小写。。。
var search_string=$(this.val().toLowerCase();
$(“#dropdown9a”).filter(函数(){
//如果不匹配则隐藏
$(this).toggle($(this).text().toLowerCase().indexOf(search_string)>-1);
if($(this).text().toLowerCase().indexOf(搜索字符串)>-1){
//结果发现
//$(“#无搜索结果”).hide();
结果_found=true;
}
//未找到任何结果
如果(!找到结果){
//$(“#无搜索结果”).show();
}
});
});
});
.material-icons.md-24{字体大小:24px;}
.下拉菜单可滚动{
高度:自动;
最大高度:244px;/*5件*/
溢出x:隐藏;
}

完成
下拉式滤波器
进一步扩展
这将帮助您:


引导下拉示例
下拉列表1
项目1
项目2
项目3

这听起来有点像是你想要一个?是的!他们最终决定支持它,但是,我们仍然受本地渲染的影响。。。