相信很多小伙伴在做商城项目时会用到商品五星评论的功能,那么我们该如何实现商品五星好评的功能呢?下面我们来实现一下。
html代码:
<div class="quiz">
<h3>我要评论</h3>
<div class="quiz_content">
<form id="form_UserType" method="post" "return false">
<input type="hidden" id="commentid" name="commentid"/>
<div class="goods-comm">
<div class="goods-comm-stars">
<span class="star_l">满意度:</span>
<div id="rate-comm-1" class="rate-comm"></div>
<input type="hidden" id="score" name="score" class="text" />
<input type="hidden" id="itemid" name="itemid"/>
</div>
</div>
<div class="l_text">
<label class="m_flo">内 容:</label>
<textarea name="commentcontent" id="commentcontent" class="text" ></textarea>
<span class="tr">字数限制为5-200个</span>
</div>
<button class="btm" "FaBiaoWenTi()"></button>
</form>
</div><!--quiz_content end-->
</div><!--quiz end-->
</div>
<!-- 评论表单 end-->
</div>
方法:
function FaBiaoWenTi(){
layer.confirm('是否发表?', { btn: ['确定', '取消'] }, function (M) {
layer.close(M);
M = layer.load();
var commentcontent=$("#commentcontent").val();
var score=$("#score").val();
$.getJSON("${ctx}/UploadingGoods/newComments.do?itemid=" + itemid
+"&commentcontent=" + commentcontent
+"&score=" + score,function(data) {
data=data.str;
layer.msg(data);
if(data.indexOf('成功')>-1){
ChongZhi();
Refresh();
}
layer.close(M);
});
});
}
效果截图:
这样你就可以实现商品五星好评的功能了,是不是很简单呢。