0

我正在构建一个简单的 asp 页面，在该页面上，每个名称的左侧都有带有复选框的人员列表。我设法创建了一个简单的 jQuery 脚本，它允许根据输入隐藏和显示表格行：http: //jsfiddle.net/Tq97v/（第一部分）

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

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

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

第二件事 - 如何在网站上创建相同“插件”的多个实例。现在我正在通过它来识别输入，但是使用该输入作为参数调用函数会很好，并且它会在该输入之后生成表格并创建必要的逻辑。这样我可以在页面上多次调用函数以获得多个列表。

我不是要求完整的解决方案（当然它总是受欢迎的:)）但我需要的是如何以有效的方式和尽可能优化的方式完成此任务，因为有时我的列表有 500 多个元素。

PS不要看HTML代码，是ASP生成的。

我找到了这个插件：https ://github.com/bcollins/jquery.tristate ，但我不知道如何在我的列表中使用它。

更新：

我已经设法将我的代码变成了函数，但现在我必须为每个列表调用 3 个函数。
这是我更新的代码： http: //jsfiddle.net/65MEV/4/
如何将其更改为一个功能？会更好吗？
这是我更新的代码。仍在考虑使用该 Indeterminate Checkbox 而不是我的删除图像的方法。

更新2

我构建了工作代码:)
http://jsfiddle.net/65MEV/9/
但我想尽可能地改进它。
欢迎任何建议！

4

2 回答 2

0

三态复选框就像三通道设备：一种幻觉。

您真正想要的是制作复选框indeterminate（通过将同名的属性设置为true）。要实现这一点，您需要在每个复选框上都有一个change（或click）处理程序，然后您需要检查它们是否都处于相同状态，如果不是，则设置indeterminate属性。确实很麻烦，因为您很少看到indeterminate复选框，因此大多数用户不知道如何处理它们。尽量避免。

于 2012-07-23T13:58:30.940 回答
0

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

例如：在您的情况下，不要将项目保留在 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;
    }
});

你只有你的实际清单。

对于树状态复选框，您不需要插件，只需添加一个按钮或链接，每次点击检查它的状态，您可以通过jQuery 数据保持状态并根据此数据更改元素图像。

于 2012-07-23T14:15:19.533 回答