2016-07-05 3 views
0

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

for(var i = 0; i<3; i++){ 
      $('.formEntry')[i].addClass("form" + i); 
    } 

Это код до функции RAN:

<fieldset class = "formEntry"></fieldset> 
<fieldset class = "formEntry"></fieldset> 
<fieldset class = "formEntry"></fieldset> 

и это желаемый результат.

<fieldset class = "formEntry form1"></fieldset> 
<fieldset class = "formEntry form2"></fieldset> 
<fieldset class = "formEntry form3"></fieldset> 

Помогите!

+0

Ответ Jayesh в порядке, поэтому я не буду публиковать другой ответ, но если вам интересно, ваш метод не работает, потому что '$ ('. FormEntry') [i]' возвращает собственный элемент DOM, t имеет функцию addClass. Вы можете либо сделать '$ ('. FormEntry'). Eq (i)' или '$ ($ ('. FormEntry') [i])', чтобы получить правильный объект jQuery, который вы можете вызвать addClass. (первый, вероятно, лучше) –

+0

@MatisLepik О, я вижу сейчас. Спасибо за разъяснения; застрял на этом какое-то время :) – nutellasandwich

ответ

1

Вы можете использовать .each() для обработки всех элементов и добавления класса с использованием метода .addClass().

$(document).ready(function() { 
 
$(".formEntry").each(function(i) { 
 
     $(this).addClass("form" + (i+1)); 
 
    }) 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<fieldset class = "formEntry"></fieldset> 
 
<fieldset class = "formEntry"></fieldset> 
 
<fieldset class = "formEntry"></fieldset>

0

Вы не должны использовать each. addClass также выполняет функцию.

$('formEntry').addClass(function(i) { return 'form' + (i+1) }) 
0

Используйте этот код для добавления класса динамически в цикле ...

jQuery(document).ready(function(){ 
 
    var i=1; 
 
jQuery('.formEntry').each(function(){ 
 
    
 
jQuery(this).addClass('form'+i); 
 
    i++; 
 
}); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<fieldset class = "formEntry"></fieldset> 
 
<fieldset class = "formEntry"></fieldset> 
 
<fieldset class = "formEntry"></fieldset>

0

Вы можете использовать ломтик():

for(var i = 0; i < 3; ++i){ 
$('.formEntry').slice(i,(i + 1)).addClass("form" + i); 
} 

API JQuery

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