Оптимизируйте jQuery Toggle на сотнях элементов

Question

У меня есть сотни элементов на странице, которые совместно используют класс, и мне нужно оптимизировать приложение jQuery Toggle(), чтобы не допустить блокировки моего браузера при применении функции следующим образом:

$j('.textDate').toggle() //this locks up this browser

Нажатие на эту функцию вызывает блокировку и зависание браузера - поэтому я попытался разбить его на цикл и запустить функцию для каждого элемента в отдельности, а затем мне нужно выяснить некоторый таймаут / разбиение массива, чтобы сохранитьбраузер от зависания:

$j('#showDatesCheckbox').click(function(){
    var textdate = $j('.textDate'); //1000+ elements
    for(var i = 0; i < textdate.length; i++)
    {
          $j(textdate[i]).toggle();
    }
});

Это все еще не работает, хотя?

Answer 1

Так же, как вопрос.

Как насчет var $textDates = $('.textDate'); для кэширования результатов.

Затем, позже, вы можете позвонить $textDates.addClass('hidden');

Кэшированный список должен составитьпоследующие операции выполняются быстрее.

Я добавил jsFiddle.net для игры: http://jsfiddle.net/cRRcC/2/

Это добавляет 30 000 элементов на страницу (divs) и затем дает вамссылка, чтобы скрыть их.

Это, кажется, занимает меньше секунды, таким образом.Поможет ли вам что-то из этого заказа?

Спасибо, AE

Answer 2

Анимация 1000+ элементов в браузере не будет работать на мой взгляд.Почему бы не использовать просто $j(textdate[i]).toggle(), который переключает видимость элементов.Если вы хотите проявить фантазию, вы можете попробовать анимировать только те элементы, которые видны пользователю.