评论区 前端实现 JSP
代码仅供参考，因为涉及到一些参数，无法直接搬运
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>Insert title here</title><link href='css/bootstrap.min.css' rel='stylesheet'><script src='js/jquery-2.1.4.min.js'></script><script src='js/bootstrap.min.js'></script><script>
var re_com_id=1;
function comment(){var content=$("#com_content").val();$.ajax({type: "GET",url:"http://localhost:8080/big/gogo?type=comment&car_id=<%=request.getParameter("id")%>&name=<%=request.getParameter("name")%>",//请求课附加值data:{ content:content},success :function(json){var item="+json.com_id+"'><%=request.getParameter("name")%>:"+content+" 回复
"$("#comment_area").append(item);alert("留言成功！");$("#com_content").html(" ");}});
}
function recom(name,com_id,re_com_id){var content=$("#re_com_"+re_com_id).val();var item="<%=request.getParameter("name")%>回复"+name+":"+content+" 回复";$("#"+com_id).append(item);$.ajax({type: "GET",url:"http://localhost:8080/big/gogo?type=re_comment&car_id=<%=request.getParameter("id")%>&name1=<%=request.getParameter("name")%>&name2="+name+"&com_id="+com_id,data:{ content:content}});
}function init(){var f;$.ajax({type: "GET",url:"http://localhost:8080/big/gogo?type=get_close&car_id=<%=request.getParameter("id")%>",success:function(json){f=json.flag;if(json.flag==0){var item="留言区
";$("body").append(item);}else{var item="留言区
";$("body").append(item);}}});$.ajax({type: "GET",url:"http://localhost:8080/big/gogo?type=get_comment&car_id=<%=request.getParameter("id")%>",success:function(json){var i=0;var j=0;var area=$("#comment_area");var n=0;var cc=-1;var sub_area;var item;var s;var a;var content=0;while(json[i]){cc=1;for(j in json[i]){if(cc<3){cc++;}else if(cc==3){if(f==0){item="+json[i].com_id+"' name='"+json[i].name+"'>"+json[i].name+":"+json[i].content+" 回复
";re_com_id++;area.append(item);sub_area=$("#"+json[i].com_id);cc++;}else{item="+json[i].com_id+"' name='"+json[i].name+"'>"+json[i].name+":"+json[i].content+"
";re_com_id++;area.append(item);sub_area=$("#"+json[i].com_id);cc++;}}else if(cc==4){s=json[i][j];cc++;}else if(cc==5){a=json[i][j];cc++;}else if(cc==6){content=json[i][j];if(f==0){var tem=""+s+"回复"+a+":"+content+" 回复";sub_area.append(tem);re_com_id++;cc=4;}else {var tem=""+s+"回复"+a+":"+content+"";sub_area.append(tem);re_com_id++;cc=4;}}}i++;}}});
}
function get_info(){$.ajax({type: "GET",url:"http://localhost:8080/big/gogo?type=market&id=<%=request.getParameter("id")%>",success: function(json){$("#car_name").text(json["car_name"]);$("#price").text(json["price"]);$("#city").text(json["city"]);$("#distance").text(json["distance"]);$("#out_put").text(json["out_put"]);$("#degree").text(json["degree"]);$("#owner").text(json["name"]);}});
}
</script>
</head>
<body><center><h2>汽车详情</h2><img src='./images/<%=request.getParameter("id")%>.png'></center><br><br><center><div style='width:500px;'><table class='table table-bordered'><tr><td>车名:</td><td id="car_name"></td></tr><tr><td>车价:</td><td id="price"></td></tr><tr><td>城市:</td><td id="city"></td></tr><tr><td>里程:</td><td id="distance"></td></tr><tr><td>档数:</td><td id="degree"></td></tr><tr><td>排量:</td><td id="out_put"></td></tr><tr><td>商家</td><td id="owner"></td></tr></table></div><a href="gogo?type=back_to_self&name=<%=request.getParameter("name")%>"><button class="btn btn-primary">返回</button></a></center> <script>init();get_info();</script>
</body>
</html>
特地提一下，用了Bootstrap实现了留言框的弹出
<a class='dropdown-toggle' data-toggle='dropdown'>回复</a>
<ul class='dropdown-menu'><form><textarea name='content' style='width:800px;margin-left:100px;' id='re_com_"+re_com_id+"'></textarea><input class='btn btn-primary' style='margin-left:20px;' type='button' value='回复' onclick='recom('<%=request.getParameter("name")%>'"+","+com_id+","+re_com_id+")'></form>
</ul>
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！