JSSelect下拉框(支持输入模糊查询)_js下拉框搜索模糊查询,js下拉框模糊查询资源-CSDN文库

版权申诉

select

5星 · 超过95%的资源 192 浏览量 2020-10-20 12:57:54 上传评论收藏 33KB PDF 举报

资源推荐

资源详情

资源评论

JS Select下拉框下拉框(支持输入模糊查询支持输入模糊查询)

主要为大家详细介绍了JS Select下拉框的相关资料，支持输入模糊查询，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

本文实例为大家分享了支持输入模糊查询的Select下拉框，供大家参考，具体内容如下

<html>

<head>

<title>Insert title here</title>

function SelectValue(obj)

{

document.all.box2.value = obj.options[obj.selectedIndex].text;

}

var j = 0;

function InputValue(obj)

{

var n = 1;

var tmpObj;

var src = document.all.SelectOption;

var msg = document.all.msg;

if(event.keyCode != 40 && event.keyCode != 38 && event.keyCode != 13){

if(obj.value!=""){

msg.style.display="";

msg.innerHTML="";

if(msg.hasChildNodes())

{

msg.childNodes[0].parentNode.removeChild(msg.childNodes[0]);

}

for (var i=0;i<src.length;i++){

var selValue = document.createElement("div");

var selText = document.createElement("div");

selText.value = src(i).value;

selText.innerHTML = src(i).text;

if (src(i).text.toLowerCase().indexOf(obj.value.toLowerCase())==0){

selText.setAttribute("id","selText"+n);

selText.onmouseover=function (){

this.style.backgroundColor='#003399';

this.style.color ='#ffffff';

}

selText.onmouseout=function (){

this.style.backgroundColor='#ffffff';

this.style.color ='#000000';

}

selText.onclick=function (){

document.all.box2.value = this.innerHTML;

msg.style.display="none";

document.getElementById("txtSection").value=this.value;

}

msg.appendChild(selText);

n++;

}

else {

document.all.msg.style.display="none";

}

else {

//press down key

if(event.keyCode==40){

j++;

for (var i=0; i<src.length; i++)

{

tmpObj = document.getElementById("selText"+i);

if(tmpObj != null){

tmpObj.style.backgroundColor='#ffffff';

tmpObj.style.color ='#000000';

}

tmpObj = document.getElementById("selText"+j);

if(tmpObj != null){

tmpObj.style.backgroundColor='#003399';

tmpObj.style.color ='#ffffff';

}else{

j = 0;

}

//press up key

if (event.keyCode==38){

j--;

for (var i=0; i<src.length; i++)

{

tmpObj = document.getElementById("selText"+i);

if(tmpObj != null){

tmpObj.style.backgroundColor='#ffffff';

tmpObj.style.color ='#000000';

本内容试读结束，登录后可阅读更多

下载后可阅读完整内容，剩余1页未读，立即下载

评论收藏

内容反馈

版权申诉

CHENYALINGDEHAO

2023-06-14

资源使用价值高，内容详实，给了我很多新想法，感谢大佬分享~

weixin_38613154

粉丝: 14
资源: 987

JS Select下拉框(支持输入模糊查询)

最新资源

JS Select下拉框(支持输入模糊查询)

JS中Select下拉列表类(支持输入模糊查询)功能

可输入的下拉框 可以用来做模糊查询

select下拉模糊查询插件

支持搜索的select下拉框

纯js实现多选下拉框并模糊查询.html

下拉框带模糊查询引入select2组件.zip

js实现带搜索功能的下拉框实时搜索实时匹配

select实现模糊查询用到的js和css文件

下拉框可输入模糊查询，自动匹配

仿百度输入框（在输入框输入时，会根据输入的内容模糊查询相关的做成下拉框显示在下面，供选择）

Select下拉框模糊查询功能实现代码

jQuery支持模糊查询下拉框菜单选择代码

进行模糊查询+多选功能的下拉框（select） 模糊加载

jquery带搜索的下拉框(可模糊搜索)

可输入，可检索的下拉框小插件。

combo-select 模糊查询下拉框

下拉框检索

《前端实现js模糊查询关键字显示下拉框功能的实例教程》源码

可模糊查询下拉框

select下拉框添加搜索功能

下拉模糊查询 带搜索框jQuery

下拉框变成下拉模糊搜索框

select多选下拉列表+模糊查询功能.rar

jquery.inputer 完美替换select控件 带模糊搜索

史上最强大的select控件(可搜索的下拉框)，支持汉字中文、拼音首字母、英文搜索方式

实现select各种搜索功能

最新资源

可输入的下拉框可以用来做模糊查询

进行模糊查询+多选功能的下拉框（select）模糊加载

下拉模糊查询带搜索框jQuery

jquery.inputer 完美替换select控件带模糊搜索