从所有中删除类并添加到单击一个

Question

我正在编写一个函数,我想从所有元素中删除一个活动类,并将其添加到刚刚单击的那个元素中.问题是,当我点击元素时,所有元素都会获得活动类.请参阅下面的代码.

var pagination = $('.pagination div');

function pager() {
    pagination.removeClass('active', function(){
        $(this).addClass('active');
    });
}

$('.pagination div').on("click", function (){
    pager();
});

我可以使用下面的代码,它实际上有效,但我想使用上面的代码的原因是有可能在其中添加其他功能,稍后将在点击时调用.

$('.pagination div').on('click',function(){
  $('.pagination div').removeClass('active');
  $(this).addClass('active');
});

HTML,如果需要

<div class="pagination">
    <div class="pagination1"></div>
    <div class="pagination2"></div>
    <div class="pagination3"></div>
    <div class="pagination4"></div>
</div>

Answer 1

通过使用单独的函数,您将丢失对当前对象的引用(this).您需要使用参数来实现工作.

function pager(element) {
    pagination.removeClass('active', function(){
        element.addClass('active');
    });
}

$('.pagination div').on("click", function (){
    pager($(this));
});