极客观点
项目管理
HarmonyOS
flow.load 当我加载第二页数据后，点击第一页的数据 会有两次事件触发，也有两次ajax请求到后端，下面是问题代码，求大佬解答协助
//流式加载页面评论区
flow.load({
elem: '#comments',
isAuto: false,
end: '<div style="font-size: 16px;color: #999;margin-bottom: 50px">没有更多评论了</div>',
done: function (page, next) {
let lis = [""];
$.get('/getCommentsByQuestionId?questionId=' + question.id + '&page=' + page, function (res) {
if (res.code === 200) {
if (res.data === null) {
lis.push("<div style='font-size: 17px;text-align: center;font-weight: 300;margin: 20px 0;color: #999'>暂无评论，快来做第一个评论的人吧~</div>");
$(".layui-flow-more").hide();
} else {
let comments = res.data;
//需要单独对每个评论进行处理
layui.each(comments, function (index, item) {
//查询评论总数
let replyNum = 0;
$.ajax({
type: "get",
url: "/getReplyNum",
async: false,
data: {parentCommentId: item.cId},
success: function (res) {
replyNum = res.data; //获取评论总数
}
});
//查询每条评论的点赞信息
let likeNum = 0;
$.ajax({
type: "get",
url: "/getLikeCount",
async: false,
data: {commentId: item.cId},
success: function (res) {
likeNum = res.data;
}
});
if (item.info === null || item.info === "") {
item.info = " ";
}
//评论用户等级头衔
let score = item.rateScore;
let cla = "";
if (score < 5) {
cla = "layui-badge layui-bg-gray";
} else if (score >= 5 && score < 15) {
cla = "layui-badge layui-bg-blue";
} else if (score >= 15 && score < 50) {
cla = "layui-badge layui-bg-cyan";
} else if (score >= 50 && score < 200) {
cla = "layui-badge layui-bg-green";
} else if (score >= 200 && score < 500) {
cla = "layui-badge layui-bg-orange";
} else {
cla = "layui-badge";
}
let html = " <div class='comment-list'>\n" +
" <div class='comment-header'>\n" +
" <ul class='index-list'>\n" +
" <li>\n" +
" <a class='comment-avatar' href='/user/" + item.uid + "'>\n" +
" <img style='border-radius: 10px' width='45' height='45' src='" + item.avatar + "'>\n" +
" </a>\n" +
" <a class='comment-index-name' href='/user/" + item.uid + "'>" + item.uname + "</a>\n" +
" <span style='border-radius: 3px;float:left;margin-right: 10px;margin-top: 3px' class='" + cla + "'><i class='fa fa-trophy' aria-hidden='true'></i> " + item.rate + "</span><p style='margin-top: 4px'>" + item.info + "</p>\n" +
" </li>\n" +
" </ul>\n" +
" </div>\n" +
" <div class='comment-description'>" + item.comment + "</div>\n" +
" <div class='clearfix' style='margin-left: 56px;margin-bottom: 38px;'>\n" +
" <span class='text-color-999 pull-right'>" + item.time + "</span>\n" +
" <span class='operate' data-id='" + item.cId + "' comment-uname='" + item.uname + "'>\n" +
" <a class='agree'>\n" +
" <i data-placement='right' style='vertical-align: -5px' class='layui-icon layui-icon-praise' data-original-title='赞同回复'></i>\n" +
" <span class='count' style='font-size: 10px;vertical-align: -2px;'>" + likeNum + "</span>\n" +
" </a>\n" +
" </span>\n" +
" <span class='sub-comment'>\n" +
" <a class='add-sub-comment' data-click='" + (index + 1) + "' href='javascript:;'>" +
" <i class='layui-icon layui-icon-dialogue'></i> <span style='font-size: 11px; vertical-align: 2px;'>" + replyNum + "</span>\n" +
" </a></span>\n" +
" </div>";
replyNum = 0;
//查询这层楼有没有楼中楼回复，并拼接html
let replyHtml = addReplyComment(item.cId, index + 1, item.uname);
lis.push(html + replyHtml);
});
}
}
//执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
//pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
next(lis.join(''), page < res.page);
//点赞评论
$(".operate").click(function () {
let me = $(this);
let commentId = $(this).attr("data-id");
let commentUsername = $(this).attr("comment-uname");
if (username === undefined || username === null || $.trim(username).length < 1) {
notice.msg("您还没有登录哦", {icon: 3, timeout: 1500});
return false;
}
if (username === commentUsername) {
notice.msg("您不能给自己点赞哦", {icon: 3, timeout: 1500});
return false;
}
$.ajax({
type: "get",
url: "/like",
async: false,
data: {
username: username,
commentId: commentId,
commentUsername: commentUsername,
questionId: question.id
},
success: function (res) {
if (res.code === 200) {
//点赞成功
if (res.data === 1) {
//修改数值
notice.info({
title: '消息通知',
message: '您点赞了 ' + commentUsername + ' 的评论',
timeout: 1500
});
let count = me.children("a").children("span").html();
let c = parseInt(count) + 1;
me.children("a").children("span").html(c);
me.css("background-color", "#499ef3");
me.children("a").children("i").css("color", "#fff");
me.children("a").children("span").css("color", "#fff");
} else {
notice.warning({
title: '消息通知',
message: '您取消了对 ' + commentUsername + ' 的点赞',
timeout: 1500
});
let count = me.children("a").children("span").html();
me.children("a").children("span").html(count - 1);
me.css("background-color", "#f5f5f5");
me.children("a").children("i").css("color", "#155faa");
me.children("a").children("span").css("color", "#155faa");
}
}
return false;
}
})
});
;
});
}
});
你把点赞评论放到了请求的回调中，那每次有请求完成不都会进行事件绑定吗，这就重复绑定了。
你应该把事件放到外面只执行一次，或者每次绑定前调用unclick进行解绑