Javascript jQuery可搜索复选框列表和三态复选框

Javascript jQuery可搜索复选框列表和三态复选框,javascript,jquery,Javascript,Jquery,我正在构建一个简单的asp页面,在该页面上,我有一组人,每个人的名字左边都有一个复选框。 我已经创建了一个简单的jQuery脚本,它允许根据输入隐藏和显示表中的行: (第一部分) 正如您所看到的,我可以输入部分名称,然后隐藏特定行。 使用红色“x”,我可以取消选中所有复选框 我现在要做的是把静态的红色“x”变成三态复选框。 甚至不知道如何开始 我必须将更改侦听器添加到列表中的每个复选框吗 第二件事-如何在站点上创建同一“插件”的多个实例。 现在我用它来标识输入,但最好用该输入作为param调用函

我正在构建一个简单的asp页面,在该页面上,我有一组人,每个人的名字左边都有一个复选框。 我已经创建了一个简单的jQuery脚本,它允许根据输入隐藏和显示表中的行: (第一部分)

正如您所看到的,我可以输入部分名称,然后隐藏特定行。 使用红色“x”,我可以取消选中所有复选框

我现在要做的是把静态的红色“x”变成三态复选框。 甚至不知道如何开始

我必须将更改侦听器添加到列表中的每个复选框吗

第二件事-如何在站点上创建同一“插件”的多个实例。 现在我用它来标识输入,但最好用该输入作为param调用函数,它将在该输入之后调整表并创建必要的逻辑。 这样,我就可以在页面上多次调用该函数,以获得多个列表

我并不是在要求完整的解决方案(当然它总是受欢迎的:),但我需要的是如何以有效的方式实现这一点,并尽可能优化,因为有时我的列表有500多个元素

另外,不要看HTML代码,它是ASP生成的


我找到了这个插件:,但我不知道如何在我的列表中使用它


更新:

我已经成功地将代码转换为函数,但现在我必须为每个列表调用3个函数。
这是我的更新代码:
如何将其更改为一个函数?会更好吗?
这是我的更新代码。仍在考虑使用不确定复选框而不是删除图像的方法

更新2

我构建工作代码:)

但是我想尽可能地改进它。

欢迎提出任何建议

三态复选框就像三个入口设备:幻觉


实际需要的是使复选框
不确定
(通过将同名属性设置为
true
)。要实现这一点,需要在每个复选框上使用
更改
(或
单击
)处理程序,然后需要检查它们是否都处于相同的状态,如果不是,则设置
不确定
属性。这真的很麻烦,因为你很少看到不确定的复选框,所以大多数用户不知道如何处理它们。尽可能避免。

创建同一插件访问元素相对于其他元素的多个实例

例如:在您的例子中,不是将项保留在jQuery对象
var$tableRows=$('table.myList tr')在事件中访问它们

$('#user_name').keyup(function () {
    var sValue = $.trim($('input#user_name').val());
    if(lastInput==sValue) return;
    var $tableRows = $(this).next().next().find("table.myList tr");
    if (sValue == '') {
        $tableRows.show();
    } else {
        $tableRows.each(function () {
            var oLabel = $(this).find('label');
            if (oLabel.length > 0) {
                if (oLabel.text().toLowerCase().indexOf(sValue.toLowerCase()) >= 0) {
                    $(this).show();
                } else {
                    $(this).hide();
                }
            }
        });
        lastInput=sValue;
    }
});
而你只有你的实际清单


对于树状态复选框,您不需要插件,只需添加一个按钮或链接,每次单击“检查其状态”,您就可以保留状态并根据此数据更改元素图像。

这是一个选项,但我的解决方案必须在IE7中工作。对不起,我的问题中没有提到。所以我认为在旧浏览器中使用图像会更容易。对不起,没有检查,只是在一些博客上找到了条目,现在确认:)我已经更新了我的问题,这样我就可以在一个站点上有多个列表,但我仍然对该复选框有问题。也许你可以用给定的类名将每个“组”包含在一个元素中,然后简单地使用
$(“.myclass”).each()调用必要的函数?我再次更新了我的问题,这次我添加了我尝试执行的工作示例。这是可行的,但我想优化它。有什么建议吗?我在object中保留了元素以加快代码速度。这样,元素只存储一个。若我这样做,那个么每次我按下input内的键时,就会创建包含所有tr元素的列表。这适用于50个元素,但当我有500多个元素和旧pc时,速度会变慢。我用函数方法更新了我的问题,但我总是乐于接受建议:)尤其是使用不确定复选框。