jQuery removeClass on parent/sibling/child

Question

Sırasız bir listedeki öğelerdeki sınıfları değiştirmek için aşağıdaki jQuery'yi kullanıyorum. Etkinin elde edilmesinin en etkili yolu gibi görünmüyor. Bunu yazmanın daha iyi bir yolu var mı?

$(function() { 
    $('nav li a').click(function() { 
     $(this).parent().siblings().children().removeClass('active'); 
     $(this).addClass('active'); 
    }); 
}); 

Teşekkür

S

Answer 1

O <li> için işleyicisi takmak ve (varsayılan olarak gerçekleşir) <a> gelen tıklama bubble up izin bu durumlarda genellikle basittir. Sonra işleyicisi şuna benzer:

$(function() { 
    $('nav li').click(function() { 
    $(this).addClass('active').siblings().removeClass('active'); 
    }); 
}); 

Ardından CSS'nizde aynen bu şekilde, <li> olmak active teşkil ediyor:

li.active a { color: red; } 

bir gibi bir kenara, birçok <li> unsurları size varsa' böyle .delegate() kullanmak isteyeceksiniz:

$('nav').delegate('li', 'click', function() { 
    $(this).addClass('active').siblings().removeClass('active'); 
}); 

Answer 2

Ayrıca unutmayın fro 'active' kaldırmak isterseniz m this hariç tüm elemanlar o zaman

$('.active').removeClass('active'); 
$(this).addClass('active'); 

gibi basit bir birlikte kaçmak Ve bu oldukça kolay ağacın yayılması gerekir. Bununla birlikte, DOM'ın yoğun bir şekilde doldurulması durumunda performansın baş ağrısına neden olduğunu görebiliyorum.

kod yukarıda kullanılan

Answer 3

, bu benim kod

enter code here : function addnewStepsUpper(){ 
jQuery('.hide_upper_clone_class').clone().insertAfter(".upper_clone_class1"); 
jQuery('.upper_clone_class1').siblings().removeClass('hide_upper_clone_class'); 

}

Teşekkür Vishal Sanwar