jQuery removeClass trên phụ huynh/anh/con

Question

Tôi đang sử dụng jQuery sau để thay đổi các lớp trên các phần tử trong một danh sách không theo thứ tự. Nó không có vẻ như đó là cách hiệu quả nhất để đạt được hiệu quả. Có cách nào tốt hơn để viết cái này không?

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

Cảm ơn

S

Answer 1

Nó thường đơn giản hơn trong những trường hợp này để đính kèm các handler cho sự <li> và để cho các nhấp chuột bubble up từ <a> (mà xảy ra theo mặc định). Sau đó xử lý của bạn trông như thế này:

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

Sau đó, trong CSS của bạn, bạn chỉ chiếm active là trên <li>, như thế này:

li.active a { color: red; } 

Là một sang một bên, nếu bạn có nhiều <li> yếu tố bạn' sẽ muốn sử dụng .delegate() như thế này:

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

Answer 2

Cũng lưu ý rằng nếu bạn muốn loại bỏ 'active' fro m tất cả các phần tử ngoại trừ this thì bạn có thể lấy đi một cái gì đó đơn giản như

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

Và điều đó nên truyền qua cây khá dễ dàng. Tuy nhiên, tôi có thể thấy nó gây ra một nhức đầu về hiệu suất nếu DOM là dân cư đông đúc.

Answer 3

tôi đã sử dụng trên mã, nó đang làm việc

Tôi đang sử dụng trong mã của tôi

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'); 

}

Cảm ơn Vishal Sanwar