оперативное обновление значения при изменении с помощью jquery

#jquery #text #live

#jquery #текст #ЖИВЫЕ КОНЦЕРТЫ

Вопрос:

У меня есть диапазон, который содержит номер элемента (в данном случае он подсчитывает количество элементов li в списке), эти элементы списка могут быть удалены, поэтому число изменится, как я могу оперативно обновлять номер каждый раз, когда список изменяется?

Это код, который я использую для подсчета элементов списка

     var getTotal = jQuery('#ul li').length;
    $(".gettotal").text(getTotal);

Я посмотрел в Google, но ничего не нашел.

1. Почему бы не запускать этот код (или добавлять его в функцию) каждый раз, когда элемент списка удаляется? Таким образом, количество li будет обновляться по мере удаления из ul .

Ответ №1:

Как создаются или удаляются ваши li-элементы? Вы захотите запустить обновление количества для этого события. Вы можете использовать возможности jQuery для создания / запуска пользовательских событий с помощью bind и trigger.

 $('#ul').bind('li_deleted', function()
{
    $('.gettotal').text( $('#ul li').length );
});

//and every time an li is deleted..
$('#ul').trigger('li_deleted');

Другой (и не очень хороший) вариант — запустить таймер на странице и проверить, изменяется ли число элементов списка — но это будет очень ресурсоемким, я бы не стал этого делать, если бы это не было последним средством.

1. Спасибо, я пробовал это, но он подсчитывает все элементы списка, но не обновляет номер, если я удаляю один.

2. если вы удалите одно из них, вам придется запустить событие снова, я не знаю контекста вашего кода, поэтому я не знаю, как они удаляются — в противном случае я бы привел вам более наглядный пример для вашей ситуации.

3. Ну, я использую это для удаления элементов jQuery(‘.ph-delete’).click(function(){ $(this).parent(‘li’). slideUp(200,функция(){ $(this).remove() }); });

4. итак, сразу после $(this).remove() выполнения $('#ul').trigger('li_deleted');

5. Ах, теперь это работает, теперь я понимаю триггер, он должен выполняться в соответствии с событием. Спасибо за простое решение!!!

Ответ №2:

В зависимости от того, как часто меняется длина вашего списка, вы можете захотеть взглянуть на плагин Data-Link для jQuery.

http://api.jquery.com/category/plugins/data-link