// 顶部框高度支撑
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')
}
Ajax gets list data + page turning button
Guess you like
Origin blog.csdn.net/miaofangchao/article/details/107153313
Recommended
Ranking