使用下拉列表<select>过滤而不是单选按钮

Question

我正在尝试使用List.js通过选择下拉列表进行过滤 我的例子是使用单选按钮正常工作。但我想用选择列表替换它们。 我试过改变这个HTML ＆LT;标签＆gt;   ＆lt; input class =“filter”type =“radio”value =“Blvd”name =“address”id =“address-all”/＆gt;林荫大道 ＆LT; /标签＆gt; ＆LT;标签＆gt;   ＆lt; input class =“filter”type =“radio”value =“Blvd”name =“address”id =“address-boulevard”/＆gt;林荫大道 ＆LT; /标签＆gt; 对此 ＆LT;选择＆GT;   ＆lt; option class =“filter-all”type =“radio”value =“all”name =“address”id =“address-all”selected＆gt;     所有   ＆LT; /选项＆GT;   ＆lt; option class =“filter”type =“radio”value =“Blvd”name =“address”id =“address-boulevard”＆gt; Boulevard   ＆LT; /选项＆GT; ＆LT; /选择＆GT; 并将.js中所有选中的实例更改为选中     var options = {     valueNames：[         '名称'，         '地址'，     ] }; var userList = new List（'users'，options）; function resetList（）{     userList.search（）;     userList.filter（）;     userList.update（）;     $（“。filter-all”）。prop（'selected'，true）;     $（'。filter'）。prop（'selected'，false）;     $（ '搜索 '）VAL（''）。 }; function updateList（）{     var values_address = $（“input [name = address]：selected”）。val（）;     的console.log（values_address）;     userList.filter（function（item）{         var addressFilter = false;         if（values_address ==“all”）{             addressFilter = true;         } else {             addressFilter = item.values（）。address.indexOf（values_address）＆gt; = 0;         }         return addressFilter     }）;     userList.update（）; } $（function（）{     $（ '输入[名称=地址]'）改变（updateList）;     userList.on（'updated'，function（list）{         if（list.matchingItems.length＆gt; 0）{             $（ '无结果'）。隐藏（）         } else {             $（ '无结果'）。节目（）         }     }）; }）; 但到目前为止，这是行不通的。感谢您的帮助。 这是原始代码的小提琴：https：//jsfiddle.net/6tht5pyk/

Answer 1

看到这个分叉的小提琴：https://jsfiddle.net/7pkq23ty/

只需将选择器从$("input[name=address]:selected").val();更改为var values_address = $("select").val();

即可

然后当然将事件绑定到select元素：$('select').change(updateList);

毋庸置疑，建议您在select元素中添加ID并在选择器中使用它，而不是使用$('select') - 我用它来进行最少量的更改你的代码。