jQuery-Animation auf Divs, die denselben Klassennamen haben

Question

Ich würde gerne wissen, ob es möglich ist, bestimmte Divs, die die gleiche Klasse teilen, zu animieren. Sobald ein Div geklickt wurde, muss die Animation nur innerhalb des angeklickten div und nicht auf allen anderen divs gleichzeitig stattfinden.

Hier ist mein Code so weit:

$(".js-wrapper-item").click(function() { 
    var box = $(this); 

    if ($('.js-wrapper-item').is(':animated')) { 
     return; 
    } 

    if ($(box).css('bottom') == '0px') { 
     $(box).stop().animate({ "bottom": "50px"}, 600); 
     $('.advantages-agency-text').stop().slideToggle(600);    
    } 

    else { 
     $(box).animate({"bottom": "0px"}, 600); 
     $('.advantages-agency-text').slideToggle(600); 
    } 
}); 

Bisher habe ich in der Lage gewesen, indem divs eigentlich nur diesen Code, um die Arbeit, die unterschiedliche Namen haben. Können Sie mir einige Hinweise geben, wie ich erreichen kann, wonach ich suche? Danke vielmals!

Answer 1

Verwenden Ereignis Delegation wie unten:

$(document).on('click','.js-wrapper-item',function(){ 
    .... 
}); 

statt $(".js-wrapper-item").click(function(){.

Sie können auch $(this).is(':animated')){ verwenden, wenn Sie diesen Block innerhalb des click-Ereignisses schreiben. Sie müssen das Element nicht erneut als $('.js-wrapper-item').is(':animated')) bezeichnen.

Sie brauchen auch nicht var box = $(this). Sie können $(this) anstelle von $(box) anrufen, wenn es sich innerhalb des gleichen Klickblocks befindet.