jQuery 计算“已选中”类的项目答案

【问题标题】：jQuery counting items with class "checked"jQuery 计算“已选中”类的项目
【发布时间】：2012-06-26 20:20:47
【问题描述】：

我正在努力解决这个问题。我有一个项目列表，并且在表单的一部分上，当某些内容经过验证时，它会将“已检查”类添加到相应的列表项中。

<ul>
<li class="title">Checklist</li>
<li class="checkType checked">Card Type</li>
<li class="checkNumber checked">Card Number</li>
<li class="checkName checked">Name on Card</li>
<li class="checkMonth checked">Expiry Month</li>
<li class="checkYear checked">Expiry Year</li>
<li class="checkCode checked">Security Code</li>
</ul>

.title{font-size:23px; font-weight:bold;}
.checked{ color:#f00;}

但我需要 jQuery 来检查每个项目是否具有 checked 类，但 title 除外。

这可行吗？

演示： http://jsfiddle.net/bQtEQ/1/

感谢答案，我现在有了以下内容

        var counting = $("li.checked:not(.title)").length;
    if (counting == 6){
        console.log(counting);
    }

【问题讨论】：

有时，你看着问题，你想知道为什么没有 10 个答案......然后你再等一秒钟......砰！
Jquery counting elements by class what is the best way to implement this?的可能重复
他只需要$(".checked").length 怎么不是重复的？
这并没有打折具有“标题”类的那个。请正确阅读问题。
是的，因为他不会勾选标题元素是他吗？也许操作应该澄清这一点，因为通过查看看起来第一个 li 元素被用作某种标题的小提琴是没有意义的。

标签： jquery css

【解决方案1】：

这可以通过 1 个简单的选择器实现

$("li.checked:not(.title)").length

这里的优点是，除了可以减少代码之外，:not() 选择器在搜索过程中被考虑在内以减少结果集。这意味着 jQuery 实例化 dom 元素的时间更少。这意味着更快的执行时间，尤其是在旧版浏览器上。

【讨论】：

【解决方案2】：

这应该为您提供所有具有类“checked”但没有类标题的<li> 元素：

$('li.checked').not('.title').length

但是 - 如果您只想要检查元素的数量：

$('.checked').length

应该够了。

【讨论】：

这样做有好处吗，而不是只使用 Ben 的回答中的选择器？
添加 li 最初会使其更快，但在事后过滤 not 会减慢速度。确定基准会很有趣。
@Archer Ben 的答案要快得多，因为它使用的是原生 javascript querySelectorAll。
@Archer - 我没有任何优势。我只是把它扔在那里作为一个快速而简单的答案。我实际上投票赞成 Ben's，因为它是一个更好的答案......

【解决方案3】：

$('.checked').not('.title').length == $("ul li").length -1

【讨论】：

【解决方案4】：

$("li").each(function() {
    if( !$(this).hasClass("title") && $(this).hasClass("checked") ) {
            alert("hah");
    }
 });

【讨论】：