jQuery подсчет элементов по классам; Каков наилучший способ реализовать это?

Question

jQuery подсчет элементов по классам; Каков наилучший способ реализовать это?

258

То, что я пытаюсь сделать, - подсчитать все элементы на текущей странице с тем же классом, а затем я буду использовать его для добавления в имя для формы ввода. В основном я разрешаю пользователям нажимать на <span>, а затем, добавив еще один для более одного и того же типа элементов. Но я не могу придумать способ считать все это просто с помощью jQuery/JavaScript.

Я собирался затем называть элемент как-то вроде name="whatever(total+1)", если у кого-то есть простой способ сделать это, я был бы чрезвычайно благодарен, поскольку JavaScript не совсем мой родной язык.

133794m3r 28 апр. 2010, в 08:10

Источник

3

первый человек, которого я увидел, получил его, и я не знал, что это простая $ ('. classname'). длина, чтобы получить его. Если бы у меня было больше, я бы дал. Не думал попробовать это так. Я устанавливал переменные совсем немного и такие простые вещи, как добавление документов и т. Д. Вау, я чувствую себя довольно глупо, теперь мне следовало бы поискать команду .length (), чтобы увидеть, что она говорит ... спасибо всем кстати.
133794m3r 28 апр. 2010, в 07:42
20

+1 За вопрос типа Йода
jbnunn 07 март 2012, в 17:14
5

@jbnunn что такое Йода?
shasi kanth 30 окт. 2014, в 06:18

Показать ещё 1 комментарий

Теги:

javascript

jquery

css

element

5 ответов

21

Получение количества элементов, относящихся к одному и тому же классу, прост, чем этот

<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
        <script type="text/javascript">

            $(document).ready(function() {
                alert( $(".red").length );
            });

        </script>
    </head>
    <body>

        <p class="red">Test</p>
        <p class="red">Test</p>
        <p class="red anotherclass">Test</p>
        <p class="red">Test</p>
        <p class="red">Test</p>
        <p class="red anotherclass">Test</p>
    </body>
</html>

Jonathan 28 апр. 2010, в 07:32

12

var count = $('.' + myclassname).length;

Max Shawabkeh 28 апр. 2010, в 07:54

7

для подсчета:

$('.yourClass').length;

должен работать нормально.

сохранение в переменной так же просто, как:

var count = $('.yourClass').length;

Alastair Pitts 28 апр. 2010, в 07:37

3

HTML:

<div>
    <img src='' class='class' />
    <img src='' class='class' />
    <img src='' class='class' />
</div>

JavaScript:

var numItems = $('.class').length; 

alert(numItems);

Скриншот демо для внутри только div

Nilesh Darade 22 авг. 2014, в 07:01

Ещё вопросы

первый человек, которого я увидел, получил его, и я не знал, что это простая $ ('. classname'). длина, чтобы получить его. Если бы у меня было больше, я бы дал. Не думал попробовать это так. Я устанавливал переменные совсем немного и такие простые вещи, как добавление документов и т. Д. Вау, я чувствую себя довольно глупо, теперь мне следовало бы поискать команду .length (), чтобы увидеть, что она говорит ... спасибо всем кстати.

PatrikAkerstrand · Accepted Answer · 2010-04-28T07-42-00.000Z

Должно просто быть что-то вроде:

// Gets the number of elements with class yourClass
var numItems = $('.yourclass').length

В качестве примечания часто бывает полезно проверить свойство длины, прежде чем связывать множество вызовов функций с объектом jQuery, чтобы убедиться, что мы действительно выполняем некоторые работы. См. Ниже:

var $items = $('.myclass');
// Ensure we have at least one element in $items before setting up animations
// and other resource intensive tasks.
if($items.length)
{
  $items.animate(/* */)
    // It might also be appropriate to check that we have 2 or more
    // elements returned by the filter-call before animating this subset of 
    // items.
    .filter(':odd')
      .animate(/* */)
      .end()
    .promise()
    .then(function () { 
       $items.addClass('all-done');
    });
}

Просто хотел поделиться, что это также работает с подсчетом дочерних элементов, как я делал, когда попал сюда: children('div.classname').length
Конечно, не хорошее решение, но идеально подходит для ОП.