Ajax+jsp实现无刷新增删数据并返回显示

Question

小弟最近在做一个微博系统，想使用ajax实现微博添加评论及删除评论的无刷新，求各位大神帮忙
jsp页面（部分）：
<!--评论开始 -->
<div id=${blog.id } style="display:none;padding:5px;" class="comment_content">
<form  id="commentform_${blog.id }">
<textarea name="comment.content" style="width:94%;height:30px;" ></textarea>
<input name="comment.blogID" type="hidden" value="${blog.id }">
<input name="authorID" type="hidden" value="${blog.userID }">
<button class="comment_btn" onclick="addComment(${blog.id})">评论</button>
</form> <!-- 显示评论开始 -->
<div id="comment_list_${blog.id }">
<c:if test="${comments!=null }">
<c:forEach items="${comments }" var="comment">
<c:if test="${blog.id==comment.blogID }">
<div style="padding:5px;">
<img class="sender_img" src=${comment.senderPic }>
<c:if test="${sessionScope.user.id==comment.senderID }">
<a class="comment_div" title="点击进入个人主页" href="concern_concernAndFans">${comment.senderName }:</a>
</c:if>
<c:if test="${sessionScope.user.id!=comment.senderID }">
<a class="comment_div" title="点击进入TA的个人主页" href="concern_friendInfo?targetID=${comment.senderID }">${comment.senderName }:</a>
</c:if>
<div class="comment_content1">${comment.content }</div>
<br>
<div class="comment_time">${comment.writeDate0 }</div>
<c:if test="${sessionScope.user.id==comment.senderID||sessionScope.user.id==sessionScope.blog.userID }">
<button onclick="deleteComment(${comment.id})" style="font-size: 10px" class="button">删除</button>
</c:if>
</div> 
<br>
<hr class="comment_hr" />
</c:if>
</c:forEach>
</c:if> </div> <!-- 显示评论结束-->ajax实现：
//添加评论
function addComment(id){
var url = "comment_addComment?blogID="+id;
var data = $("#commentform_"+id).serialize();
$.ajax({
type:"POST",
url:url,
dataType:"json",
data:data,
async:true,
success:function(data){
if(data.result=="1"){
alert("评论成功");
$("#"+id).attr("style","padding:5px");
//$("#"+id).html(data);
}else{
alert("评论失败");
}
}
});
}
//删除评论
function deleteComment(id){
var url = "comment_delComment";
var data = "comment.id="+id;
if(confirm("确定删除吗？")){
$.ajax({
type:"POST",
url:url,
dataType:"json",
data:data,
async:false,
success:function(data){
if(data.result=="1"){
//$("#comment_list").html(data);
$("#"+id).remove();
//window.location.reload();
}else{
alert("操作失败");
}
}
});
}
}

Answer 1

百度一大把~
就是用AJAX访问后台，接收到结果后操作DOM

Answer 2

就是我要把form表单提交的数据放到comment_list   div里面怎么弄

Answer 3

  没明白无刷新是什么意思。   如果是刷新的话 可以直接 location. reload()

Answer 4

ajax提交成功后，找到对应的评论最后一个dom对象，采用$(dom).append（'html'）方法进行界面的变换

Answer 5

说明js还有待加强。。ajax请求后台并将要删除的评论id传给后台，后台根据传过来的id删除评论，ajax的回调函数里面用js将删除的评论抹掉