个人博客

2021年5月11日:

今天是开始做团队作业的不知第几天,目前还未完成的功能有信息通信,查看信息详情,成员列表和社团列表的分页显示,以及活动的创建和活动的签到活动,团员的入团申请以及判断社团的各种情况。

今天大致开始做了成员列表的分页代码,详情js代码如下:

var page=1;
var l=1;
var pa;
$(function() {
$("#prev").attr("style","visibility:hidden");
$.ajax({
url : "${pageContext.request.contextPath}/user/page",
data : "page=1&id="+${club.id},
type : "get",
success : function(data) {
$.each(data,function(){
var li=$("<li style='float: left; margin-right: 35px; width: 140px; margin-bottom: 50px;'></li>");
var a=$("<a class='user-profile dropdown-toggle'></a>").attr("href","javaScript:;");
var img=$("<img>").attr("src","${pageContext.request.contextPath}/statics/images/user/"+this.head_img);
if(this.user_type==2){
$("#ul").append(li.append(a.append(img).append(this.true_name+"(社长)")));
}else
{
$("#ul").append(li.append(a.append(img).append(this.true_name)));
}
})
}
})
})
var users = ${users};
if(users.length > 1){
$("#page").show();
}
function prev() {
$("#next").attr("style","visibility:visible");
page--;
if(page==1){
$("#prev").attr("style","visibility:hidden");
}
$.ajax({
url : "${pageContext.request.contextPath}/user/page",
data : "page=" + page+"&id="+${club.id},
type : "get",
success : function(data) {
l-=pa;
pa=data.length;
$("#ul").empty();
$.each(data,function(){
var li=$("<li style='float: left; margin-right: 35px; width: 140px; margin-bottom: 50px;'></li>");
var a=$("<a class='user-profile dropdown-toggle'></a>").attr("href","javaScript:;");
var img=$("<img>").attr("src","${pageContext.request.contextPath}/statics/images/user/"+this.head_img);
if(this.user_type==2){
$("#ul").append(li.append(a.append(img).append(this.true_name+"(社长)")));
}else
{
$("#ul").append(li.append(a.append(img).append(this.true_name)));
}
})
}
})
}
function next() {
page++;
$("#prev").attr("style","visibility:visible");
$.ajax({
url : "${pageContext.request.contextPath}/user/page",
data : "page=" + page+"&id="+${club.id},
type : "get",
success : function(data) {
pa=data.length;
l+=data.length;
if(l==users.length){
$("#next").attr("style","visibility:hidden");
}
$("#ul").empty();
$.each(data,function(){
var li=$("<li style='float: left; margin-right: 35px; width: 140px; margin-bottom: 50px;'></li>");
var a=$("<a class='user-profile dropdown-toggle'></a>").attr("href","javaScript:;");
var img=$("<img>").attr("src","${pageContext.request.contextPath}/statics/images/user/"+this.head_img);
if(this.user_type==2){
$("#ul").append(li.append(a.append(img).append(this.true_name+"(社长)")));
}else
{
$("#ul").append(li.append(a.append(img).append(this.true_name)));
}
})
}
})
}

该功能是指设置一个全局变量page并且设置为1,当页面一加载就会执行这段js代码,然后就会发起ajax请求,并且把数据显示在页面上,一个页面上最多显示20个,当前只是设置了一个作为方便操作。

posted @ 2021-05-11 19:23  一条快乐的小鲸鱼  阅读(33)  评论(0编辑  收藏  举报