ajax获取列表数据+翻页按钮

// 顶部框高度支撑
window.onload = function () {
  $('.TopLogoProp').height($('.TopLogo').height())
  $('.TopLogo').css('position', 'fixed')
  //li的点击事件：
  $(".pagination>li").on("click", function () {
    var i;
    var textNum;//列表要变更的值
    var ListLen = $(".getData ").length //列表的长度
    //总页数存在了这里：$(".pageCount").text()
    var pageCount = parseInt($(".pageCount").text());
    // 1、点击列表数字时，切换刷新列表内容
    if ($(this).hasClass('getData')) {
      if ($(this).hasClass('active') || $(this).text() == '--') { return }
      else {
        var page = $(this).text()
        Refresh(page)
        $(document).scrollTop(0)
        $('.getData').removeClass('active')
        console.log($(this))
        $(this).addClass('active')
      }
    }
    //2、点击左按钮：
    else if ($(this).hasClass('leftList')) {
      //判断是否是第一页
      if ($('.getData').eq(0).text() == 1) { return }
      // 否则刷新数字列表
      //最后一页往前翻页时：
      else if ($('.getData').eq(4).text() == '--') {
        for (var i = 0; i < ListLen; i++) {
          textNum = pageCount - pageCount % ListLen - ListLen + 1 + i
          $('.getData').eq(i).find('a').text(textNum)

        }
      }
    else {
      for (var i = 0; i < ListLen; i++) {
        textNum = parseInt($('.getData').eq(i).text()) - ListLen
        $('.getData').eq(i).find('a').text(textNum)
      }
      //取消当前数字高亮
      $('.getData').removeClass('active')
    }
  }
    //3、点击右按钮
    else if ($(this).hasClass('rightList')) {
    // 判断是否是最后一页,
    if ($('.getData').eq(4).text() == pageCount || $('.getData').eq(4).text() == '--') { return }
    // 最后一页的渲染不同
    // 往下就是最后一页
    else if ($('.getData').eq(4).text() == pageCount - pageCount % ListLen) {
      for (var i = 0; i < ListLen; i++) {
        if (i > pageCount % ListLen - 1) {
          $('.getData').eq(i).find('a').text('--')
        } else {
          textNum = parseInt($('.getData').eq(i).text()) + ListLen
          $('.getData').eq(i).find('a').text(textNum)
        }
      }
    }
    else {
      for (var i = 0; i < ListLen; i++) {
        textNum = parseInt($('.getData').eq(i).text()) + ListLen
        $('.getData').eq(i).find('a').text(textNum)
      }
      //取消当前数字高亮
      $('.getData').removeClass('active')
    }
  }
})
}

//Refresh刷新列表：翻页时，=2才会翻页，0,1 都是显示第一页的数据
function Refresh(page) {
  var i;
  var content = '';
  var query;
  if (page) {
    query = "?page=" + page
  } else {
    query = ''
  }
  $.ajax({
    url: "../MobileData.asp" + query,
    dataType: 'json',
    success: function (data) {
      // console.log(data);
      for (i = 0; i < data.length; i++) {
        $('#nongyao li>a').eq(i).attr('href', 'http://xxx.net/co_' + data[i].href).find('img').attr({ src: 'http://xxx.net/UpFile' + data[i].img }, { alt: data[i].name })
        $('#nongyao li>div a').eq(i).attr('href', 'http://xxx.net/co_' + data[i].href).text(data[i].name)
      }
    }
  });
}
//获取列表数据的方法
function getData (page){
  var i;
  var content = '';
  var query;
  if(page){
    query = "?page="+page
  }else{
    query = ''
  }
  $.ajax({
    url: "../MobileData.asp"+query,
    dataType: 'json',
    success: function (data) {
      // console.log(data);
      for (i = 0; i < data.length; i++) {
          if(i == 0 ){
            content = `<li><a href="http://xxx.net/co_${data[i].href}/" target="_blank">
        <p class="tp"><img src="http://xxx.net/UpFile${data[i].img}" width="220" height="110" alt="${data[i].name}"></p>
        </a><div class="flzs"><p class="ap"><a href=http://xxx.net/co_${data[i].href}/" target="_blank">${data[i].name}</a></p>
        </div></li><span class="pageCount" style="display:none">${data[0].pageCount}</span>`
          } else {
            content += `<li><a href="http://xxx.net/co_${data[i].href}/" target="_blank">
            <p class="tp"><img src="http://xxx.net/UpFile${data[i].img}" width="220" height="110" alt="${data[i].name}"></p>
            </a><div class="flzs"><p class="ap"><a href=http://xxx.net/co_${data[i].href}/" target="_blank">${data[i].name}</a></p>
            </div></li>`
        }
      }
      // console.log(content)
      $('#nongyao').append(content)
    }
});
  $('.getData').eq(0).addClass('active')
}