Question

要么我在这里犯了一个非常愚蠢的错误，要么jQuery的.add方法存在错误。很可能是前者。

我正在尝试实现可以选择的项目列表。这是我的code on jsfiddle。

失败的测试用例如下：

单击第一个元素以选择它。
按住Ctrl键并单击第二个元素以将其选中。
然后点击第三个元素（不含Ctrl）。

现在，我希望第一个和第二个被取消选择，我相信实现也会这样做。但第二个没有被取消选择。

挖掘一点，似乎.add实际上并没有将我的元素添加到jQuery对象集中，对于我的生活，我无法弄清楚原因。

对此有何建议？或者这不是.add方法应该使用的方式吗？

编辑：我知道jquery-ui可以控制这种事情，但我已经对它进行了评估，但它对我不起作用。感谢。

Answer 1

.add返回一个新的jQuery对象，因此您需要获取返回的值。

prevSelections = prevSelections.add(...);

以下是其他一些清理：

var ps = $(),
    clazz = 'selected';
$('#list').delegate('li', 'click', function(e) {
    if (e.ctrlKey) {
        ps = ps.add($(this).toggleClass(clazz));
    } else {
        if (ps.length) {
            ps.removeClass(clazz);
        }
        ps = $(this).addClass(clazz);
    }
});

演示：http://jsfiddle.net/mattball/mAPQA/

Answer 2

add构造一个新的jQuery节点集对象。

而不是

prevSelections.add($(this).toggleClass('selected');

do

prevSelections = prevSelections.add($(this).toggleClass('selected');

使用jQuery的.add方法

2 个答案: