<script type="text/javascript">
var isSubcomment = false; //false 默认是一级评论
var pid;
var len;
//点击一级评论de回复触发此事件函数
function addcom(obj) {
//不这样写了,直接把回复的对象填到模板评论框中,就像博客园的回复一样。一级评论和回复都用同一个文本域。
var replyname = $(obj).parent().prev().text();
//在这里获取replyname的长度,因为在其他地方获取不到replyname的值,也就更不能获取长度了
len = replyname.length;
$('#comment').val('@'+replyname+'\n');
//滚动到评论文本域位置
scrollTo('#comment',300);
isSubcomment = true; //true 表示提交二级评论
pid = $(obj).siblings('.parent_id').text();
}
//点击二级评论的回复触发此事件函数
function addsubcom(obj) {
var replyname = $(obj).parent().siblings('#nickname').text();
len = replyname.length;
$('#comment').val('@'+replyname+'\n');
scrollTo('#comment',300);
isSubcomment = true; //true 表示提交二级评论
pid = $(obj).siblings('.parent_id_2').text();
}
/*不能在addcom函数里触发.btn-submit点击事件,应该是交给.btn-submit事件回调函数自己判断触发那个函数。这样就不会和addcom
* 耦合,否则在addcom函数里触发此事件耦合度太高。最主要的是在addcom里触发事件实现不了想要的功能。。。
* 点击提交评论按钮的时候,需要判断提交的是一级评论还是二级评论。通过全局变量来判断。
* 行内事件和其他类型绑定事件不能共存?
*/
function submitbtn() {
if(isSubcomment === true){
//提交二级评论
sentsubcomment();
}else{
sentcomment();
}
}
//获取评论文本域提交按钮元素,调用此函数发送ajax
function sentsubcomment() {
// alert('提交二级评论');
var content = $('#comment').val(); //评论内容,需要处理,把replyname去掉
//截取content,已经获取到replyname的长度,直接把他截取掉即可"@+replyname",并且还可以通过截取获得replyname的值,不然没办法获取
var replyname = content.substr(0,len+1).substr(1); //+1是因为还有个@
content = content.substr(len+1); //不需要删除replyname,直接从replyname后开始截取不就OK了
var parent_id = pid;//需要动态获取,获取parent_id=0的评论的id作为回复的parent_id
var nickname = $('#username').text();//昵称即登录的用户名,本来想做为全局变量获取一次,但是声明为全局变量就是undefined,wtf?
var head_pic = $('.photo').attr('src');//登录用户的头像
var post_id = $('#comment_post_ID').val();
$.ajax({
type: 'post',
url: '/comment',
data: {content:content, parent_id:parent_id, nickname:nickname, head_pic:head_pic, post_id:post_id, replyname:replyname},
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
success: function(data) {
if(data.status){
location.reload();
}else{
alert('评论失败,请重试');
}
},
error: function() {
alert('未知错误,请重新发送');
},
})
}
//当发表评论的时候,是需要直接触发.btn-submit按钮事件的。所以这里就有分支。
//1.通过事件执行顺序来判断是一级评论还是二级评论 2. 通过文本域中是否有replyname判断是一级评论还是二级评论
function sentcomment() {
// alert('提交一级评论');
var content = $('#comment').val(); //评论内容
var parent_id = 0;//需要动态获取
var nickname = $('#username').text();//昵称即登录的用户名,本来想做为全局变量获取一次,但是声明为全局变量就是undefined,wtf?
var head_pic = $('.photo').attr('src');//登录用户的头像
var post_id = $('#comment_post_ID').val();
$.ajax({
type: 'post',
url: '/comment',
data: {content:content, parent_id:parent_id, nickname:nickname, head_pic:head_pic, post_id:post_id},
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
success: function(data) {
if(data.status){
location.reload();
}else{
alert('评论失败,请重试');
}
},
error: function() {
alert('未知错误,请重新发送');
},
})
}
//滚动到指定位置
function scrollTo(element,speed) {
if(!speed){
speed = 300;
}
if(!element){
$("html,body").animate({scrollTop:0},speed);
}else{
if(element.length>0){
$("html,body").animate({scrollTop:$(element).offset().top-200},speed);
}
}
}
//一级评论移入显示回复按钮
function addreply(obj) {
// $(obj).append('<a href="javascript:;"> 回复# </a>'); //这种抓取不到回复文本,无法实现点击事件
//想到了,我不用append动态添加“回复”,我用样式控制显示和隐藏
$(obj).find('a').css('display','inline-block');
}
//一级评论移出隐藏回复按钮
function removereply(obj) {
// $(obj).find('a').remove();
$(obj).find('a').css('display','none');
}
//二级评论移入显示回复按钮(所有一级评论之外的回复我都统称二级评论)
function addsubreply(obj) {
// alert(2);
// $(obj).append('<a href="javascript:;">回复#</a>');
// $(this).off('click');
$(obj).find('a').css('display','inline-block');
}
//二级评论移出隐藏回复按钮
function removesubreply(obj) {
// $(obj).find('a').remove();
$(obj).find('a').css('display','none');
}
</script>