Удалите несколько классов из нескольких элементов с помощью jquery

Этот код $ и animate.css, связанный по ссылке jsfiddle, добавляют эффекты анимации к полям или изображениям.Удалите несколько классов из нескольких элементов с помощью jquery

$('.box1').addClass('animated bounceInUp');

добавляет анимированный класс и класс эффектов.

$('.box1').removeClass('animated bounceInUp');

удаляет классы.

Проблема заключается в том, что я планирую использовать не менее 100 коробок/изображений, поэтому должен быть способ добавить/удалить все анимированные и эффектные классы одновременно.

Это код, который я сейчас использую и jsFiddle:

jsfiddle

$(document).ready(function() { 
     $('.box1').addClass('animated bounceInUp'); 
     $('.box2').addClass('animated bounceInLeft'); 
     $('.box3').addClass('animated flipInX'); 
     // 
     var wait = window.setTimeout(function() { 
      $('#boxes *').removeClass('animated'); 
     }, 3300); 

    });

Однако это только удаляет анимированные классы из элементов (все действие различны), так что вы не можете добавьте новые классы эффектов. Я не мог понять, что добавить с анимированным в '.removeClass (' animated ')'. Спасибо заранее.

источник

2013-02-19 drnsrc

Вы можете удалить все классы, оставив имена в функции - $ (# boxes * '). RemoveClass(); И #boxes - это идентификатор для одного элемента - если вам нужно получить все элементы, которые вы могли бы использовать $ ('element [class^= "box"'). RemoveClass(); –

http://jsfiddle.net/rUHpf/13/ –

Обновление: Я переназначение атрибут класса, который стирает все классы после начального класса .box1, .box2 и т.д.

$(function() { 
    $('.box1').addClass('animated bounceInUp'); 
    $('.box2').addClass('animated bounceInLeft'); 
    $('.box3').addClass('animated flipInX'); 
    // 
    var wait = window.setTimeout(function() { 
     $('#boxes > div').each(function(){ 
      this.className = this.className.split(' ')[0]; 
     }) 
    }, 3300); 
});

Использование прямой JavaScript this.className быстрее, чем что-либо метода JQuery.

Пока все непосредственные детишки divs элемента #boxes действительно коробки, то селектор $('#boxes > div') в порядке.

Обновлено Fiddle:http://jsfiddle.net/rUHpf/18/

источник

2013-02-19 19:29:35 iambriansreed

Зачем указывать каждый класс? –

@JayBlanchard ** OP ** said '", поэтому должен быть способ добавить/удалить все анимированные и эффектные классы одновременно ". Поэтому он ** не хочет избавиться от неанимированных и неэффективных классов, которые требуют уточнения каждого класса для удаления. – iambriansreed

@iambriansreed Есть около 35 эффектов, и я буду использовать более 100 ящиков. Мне просто нужно удалить все недавно добавленные классы эффектов из всех классов ящиков. – drnsrc

Вы можете установить любое свойство HTML тегов с помощью метода JQuery attr.

Если вы хотите удалить все классы от чего-либо с классом «анимированный», но оставить класс «анимированный», вы можете использовать следующее:

$(".animated").attr("class", "animated");

Это удалит все другие классы, установив " class "атрибута всех совпадающих тегов на" анимированные ", и ничего больше.

источник

2013-02-19 19:45:55

:(К сожалению, нет единого унифицированного имени класса для всех рассматриваемых элементов DOM. – iambriansreed

Удалите несколько классов из нескольких элементов с помощью jquery

ответ

Смежные вопросы