目录结构:
1,功能模块:提交问题(使用ajax,局部刷新)
前端
//要导入对应的js!()
<!--评论区-->
<hr class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" id="comment_section">
<!--评论人的信息-->
<div class="media" >
<div class="media-left">
<a href="#">
<img class="media-object img-rounded"
th:src="${question.user.avatarUrl}">
</a>
</div>
<div class="media-body">
<h5 class="media-heading" >
<span th:text="${question.user.name}"></span>
</h5>
</div>
</div>
<input type="hidden" id="question_id" th:value="${question.id}">
<textarea class="form-control comment" rows="6" id="comment_content"></textarea>
<button type="button" class="btn btn-success btn-comment" onclick="post()">回复</button>
</div>
js代码:
function post() {
var questionId = $("#question_id").val();
var content = $("#comment_content").val();
$.ajax({
type: "POST",
url: "/comment", /*要提交到的地址*/
contentType: 'application/json',
data: JSON.stringify({
"parentId": questionId,//注意前面的名称要对应!!
"content": content,
"type": 1
}),
success: function (response) {
if (response.code == 200) {
$("#comment_section").hide();//隐藏
window.location.reload();//重新加载,刷新!
} else {
alert(response.message);
}
},
dataType: "json"
});
}