添加 rel= 属性到 SEO 的 Bootpag 分页

Question

我通过 ajax 调用使用 Bootpag 分页，我正在寻找一种方法将 rel='next' rel='prev' 添加到链接中，我得到了作为基于 'active' class 添加它们，所有先前链接上的 'prev' 属性和所有下一个链接上的 'next' 但是当我使用分页时，属性不会改变。

附加属性的代码

if ( $('ul.pagination li').hasClass('active') ) {
   $('li.active').prevAll().attr("rel","prev");
 }
 if ( $('ul.pagination li').hasClass('active') ) {
   $('li.active').nextAll().attr("rel","next");
 }

分页代码

$('#pagination_container').bootpag({
    total: ${myOrdersData.totalNumberOfPages},
    leaps: true,
    firstLastUse: true,
    first: '| &lt;',
    last: '&gt; |',
    wrapClass: 'pagination',
    activeClass: 'active',
    disabledClass: 'disabled',
    nextClass: 'next',
    prevClass: 'prev',
    lastClass: 'last',
    firstClass: 'first'
})
  .on("page", function(event, /* page number here */ num){
    $.ajax({
      type:"get",
      url: "ordersByPageNumber?pageNumber="+num,
    })
    .done(function(data) {
     $("#previousOrders").html( data );
    });
  });

分页效果很好，只是在链接上添加了 rel 属性。

编辑澄清

<ul class="pagination bootpag">
<li data-lp="1" class="first" rel="prev">
  <a href="javascript:void(0);">| &lt;</a>
</li>
<li data-lp="1" class="prev" rel="prev">
  <a href="javascript:void(0);">&lt;</a>
</li>
<li data-lp="1" class="">
  <a href="javascript:void(0);">1</a>
</li>
<li data-lp="2" rel="next" class="active">
  <a href="javascript:void(0);">2</a>
</li>
<li data-lp="3" rel="next">
  <a href="javascript:void(0);">3</a>
</li>
<li data-lp="3" class="next" rel="next">
  <a href="javascript:void(0);">&gt;</a>
</li><li data-lp="3" class="last" rel="next">
  <a href="javascript:void(0);">&gt; |</a>
</li>
</ul>

Answer 1

基于上面的代码，在你的 'page' 事件处理程序中是这样的：

.on("page", function(event, /* page number here */ num){

    var $lis = $('.bootpag li').not('.first, .last, .prev, .next'),
        $active = $('.bootpag li.active');

    $lis.removeAttr('rel');
    $active.prev().attr('rel', 'prev');
    $active.next().attr('rel', 'next');

    ...the rest of your code

添加 rel= 属性到 SEO 的 Bootpag 分页

Adding rel= attributes to Bootpag Pagination for SEO

javascript

jquery

pagination