Javascript Jquery：键入时筛选下拉列表

我使用了一个原型插件，它可以在您键入时过滤下拉列表的内容。因此，例如，如果在文本框中键入“cat”，则只有包含子字符串“cat”的项才会作为选项保留在下拉列表中

有人知道jquery插件可以做到这一点吗？

jquery插件

编辑：我最初链接到错误的自动完成插件。

检查这些插件：

我几年前写的。它可能很容易打包成jQuery插件。欢迎你来
如果您想查看其中的代码，我也可以在我的仪表板小部件中执行此操作。
尝试“jquery选项过滤器”，它基于实际选择框并在选项文本中间匹配：

---

对于diyism，我只是在寻找类似的东西，而对于我所需要的东西来说，最好的一个似乎就是diyism。它将多个选择框变成了一个非常灵活的双列表视图，主列表上有实时过滤功能
编辑：新发展
是一个JavaScript插件，它使冗长、笨拙的选择框更加用户友好。它目前有jQuery和Prototype两种版本

---

在可预见的未来，我将在所有使用select的项目上完全使用。
是一个相当新的select分支，有很多特性（例如，针对单个项目的AJAX+自定义HTML）。
我刚刚快速地实现了这个特性。它使用了一些全局变量，您可能希望改进实现以删除这些变量
这里的“#xsca_member_filter”是作为文本输入的过滤器，“#members”是选择输入

$('documenet').ready(function(){
    init();
   $('#xsca_member_filter').keyup(function(){
       filter($(this));
   });
});

//save all available options with their values and the empty option.
init = function(){
    options = new Object();
    $('#owner option').each(function(){
        var obj = $(this);
        if(obj.attr("value") != "")
            options[obj.attr('value')] = obj.html();
        else
            emptyOption = obj.html();
    });
    selObj = $('#owner');
};

filter = function(elem){
    var filter = elem.val();
    var selected = $('#owner option:selected').val();

    //delete all options and add the empty option
    selObj.html("");
    selObj.append("<option> "+emptyOption+" </option>");

    //add all options conaining the filter string
    for(value in options){
        var option = options[value];
        if((options[value]).indexOf(filter) != -1){
            selObj.append("<option value='"+value+"'> "+options[value]+" </option>");
        }
    }

    //select the previously selected option
    $("#owner option[value = '"+selected+"']").prop("selected", true);
}

$（'documenet'）.ready（函数（）{
init（）；
$（'#xsca_成员_筛选器'）.keyup（函数（）{
过滤器（$（此））；
});
});
//保存所有可用选项及其值和空选项。
init=函数（）{
选项=新对象（）；
$（“#所有者选项”）。每个（函数（）{
var obj=$（本）；
如果（对象属性（“值”）！=“”）
选项[obj.attr（'value'）]=obj.html（）；
其他的
emptyOption=obj.html（）；
});
selObj=$（“#所有者”）；
};
过滤器=功能（元素）{
var filter=elem.val（）；
var selected=$（“#所有者选项：selected”）.val（）；
//删除所有选项并添加空选项
html（“”）；
selObj.append（“+emptyOption+”）；
//添加包含筛选器字符串的所有选项
for（选项中的值）{
var期权=期权[价值]；
if（（选项[值]）.indexOf（过滤器）！=-1）{
selObj.append（“+options[value]+”）；
}
}
//选择以前选择的选项
$（“#所有者选项[值='”+选定项+“']”）prop（“选定项”，true）；
}

$（文档）.ready（函数（）{
$（“#myInput”）。在（“keyup”，function（）上{
var value=$（this.val（）.toLowerCase（）；
$（“#过滤器*”）。过滤器（函数（）{
$（this）.toggle（$（this）.text（）.toLowerCase（）.indexOf（value）>-1）
});
});
});

滤器



筛选依据：
全部的
支付
认可的
悬而未决的
拒绝
此插件上次更新是在一年前（2008年1月）；这在i-net中的时间有点长。据我所知，它在所有浏览器中都能完美地完成这项工作——我已经在生产中使用了它。现在你让我有点担心…它是过滤列表还是只根据输入创建列表？@Andrew，是的，它可以，你只需要在传递给它的选项中定义它的行为。这是最好的插件。这正是我想要的。您介意有人将其打包为JQuery插件并分发吗？我正在考虑下个月发布一些插件，这将是一个很好的插件。如果可以的话，也许可以链接到源代码中的原始页面？当然可以，如果它被发布的话！我一直坐在一堆代码上，我一直想在今年年初以JQuery/prototype插件的形式发布这些代码！这也符合多选列表的需要。太棒了+100分！MultiSelect正是我一直在寻找的插件@标记退房；它似乎比MultiSelect好得多。很好的发现，这个插件是boss。小部件不允许多选（即，按住shift键并单击以选择一系列项目，根据组合框的原始功能），这是不幸的。@EdBrannin你认为哪一个是基于选择的？对于简单的选择标记示例。链接似乎断开了。