Question

我正在制作一个AJAX分页，我是通过使用此代码制作的。

$(document).ready(function() {

  var pagination = $("#pagination");
  var url = urlProviderOffers;

  updateContent(function(json) {});

  pagination.on('click', "ul a", function(e) {

    e.preventDefault();

    var page_to_visit = $(this).text();

    updateContent(function(json) {});

    pagination.find('ul li').removeClass('active');
    $(this).parent().addClass('active');

  });

  function updateContent(callback, page_to_visit) {

    page_to_visit = typeof(page_to_visit) != 'undefined' ? page_to_visit : 1;

    $.ajax({
      url: url,
      data: {
        page: page_to_visit
      }
    }).done(function(json) {

      if (json.total > 1) {
        pagination.find("ul li:nth-child(1)").addClass('active');
      }

      callback(json);

    });
  }

  url = template_url.replace(/provider_id_to_change/, providerID);
  return url;
}
});

<div id="pagination">
  <ul class="pagination">
    <li class="active"><a href="/provider/prov_2/offers?page=1">1</a>
    </li>
    <li><a href="/provider/prov_2/offers?page=2">2</a>
    </li>
    <li><a href="/provider/prov_2/offers?page=3">3</a>
    </li>
  </ul>
</div>

我遇到的问题是，每当我点击其中一个分页链接时，就会调用一个函数，在此函数内部我会更改用户访问过的active链接。

例如，当我的页面加载时，函数updateContent将当前页面的访问次数设置为1.在点击分页的另一个链接后，我删除所有添加的类并添加一个新的{{ 1}}类到选定的链接。

在我的情况下，当我点击链接时，将所选链接的类设置为active并自动删除添加的类并将活动类设置为第一个链接。

请帮助我解决这个问题

使用jquery更改选择链接的css

0 个答案: