jQuery 计算jquery中具有相同类的元素数量
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7138675/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Counting the number of elements with the same class in jquery
提问by Wern Ancheta
How do I count dynamically generate elements with the same class in jquery? I found a similar question, but unfortunately it didn't work. jQuery counting elements by class; what is the best way to implement this?
如何在jquery中计算动态生成具有相同类的元素？我发现了一个类似的问题，但不幸的是它没有用。 jQuery 按类计算元素；实现这一点的最佳方法是什么？
I did something like this which I based from the answers:
我根据答案做了类似的事情：
$('.capital_class').live('blur', function(){
alert($(this).length);
});
The elements with a class of capital_class are dynamically generated. But I always get the length of 1, whenever I blur. How do I get this correctly?
类为 capital_class 的元素是动态生成的。但每当我模糊时，我总是得到 1 的长度。我如何正确地得到这个？
回答by Hogan
Change the alert to this:
将警报更改为：
alert($('.capital_class').length);
Remember the event is called on a single element so thisis just a single element -- you have to have jQuery query the dom after the event happens. (The first query just sets up the live handling to create the event handlers.)
请记住，事件是在单个元素上调用的，因此this它只是一个元素——您必须在事件发生后让 jQuery 查询 dom。（第一个查询只是设置实时处理以创建事件处理程序。）
回答by Digital Plane
Use this:
用这个：
$('.capital_class').live('blur', function(){
alert($('.capital_class').length);
});
thisin the function refers to the event target, and when you do $(this).length, it returns 1 because that element doesn't have any duplicates.
this在函数中指的是事件目标，当你这样做时$(this).length，它返回 1 因为该元素没有任何重复项。
回答by user113716
This may not be what you need in this case, but in order to make it more dynamic in case you have multiple classes, and want to ensure that allclasses match, you can do this:
在这种情况下，这可能不是您所需要的，但是为了在您有多个类的情况下使其更具动态性，并希望确保所有类都匹配，您可以这样做：
$('.capital_class').live('blur', function(){
var classes_selector = '.' + $.trim(this.className).replace(/\s+/g,'.');
alert($( classes_selector ).length);
});
You're basically replacing all instances of one or more consecutive spaces in the classNameproperty with a single .character. This is because the class-selector[docs]is capable of selecting based on matching allclasses provided.
您基本上是用className单个.字符替换属性中一个或多个连续空格的所有实例。这是因为class-selector[docs]能够根据匹配提供的所有类进行选择。
It also uses the jQuery.trim()[docs]method to get rid of any leading/trailing space.
它还使用jQuery.trim()[docs]方法去除任何前导/尾随空格。
Now if you add and remove additional classes to your element that received the event, it will always only match those elements that have all the same classes.
现在，如果您向接收该事件的元素添加和删除其他类，它将始终只匹配那些具有所有相同类的元素。
If instead you want to match all elements that have any oneof the classes that the original element does, then do this:
相反，如果您想匹配具有原始元素所具有的任一类的所有元素，请执行以下操作：
$('.capital_class').live('blur', function(){
var classes_selector = '.' + $.trim(this.className).replace(/\s+/g,',.');
alert($( classes_selector ).length);
});
This simply adds a comma to the selector to separate the classes, creating a multiple-selector[docs].
这只是在选择器中添加一个逗号来分隔类，创建一个multiple-selector[docs]。
