在做商品评价时，一般情况下，我们需要一个星级评分的组件，而jQuery Raty恰好满足我们的需求。

一、展示

二、使用教程

、下载插件

https://github.com/wbotelhos/raty

、导入文件

脚本类型=' text/JavaScript ' src=' http : $ { CTX }/components/raty/jquery。拉蒂。js '/脚本链接类型=' text/CSS ' rel='样式表href=' $ { CTX }/components/raty/jquery。拉蒂。CSS '/，设置raty的全局图片路径

$ .fn。拉蒂。默认值。路径=公共。CTX '/组件/raty/图像'；

主要是指定五角星的显示样式，可以是五角星，也可以是其他。

、新增raty的差异

form class=' form-需要水平-validate '方法='post' div class='form-group '标签为=' class=' col-MD-2控件-标签'评价星级/label div class=' col-MD-10 ' div class=' raty ' name=' level ' data-bv-note mpty $ { good _ comment。level }/div/div class=' form-group text-center ' div class=' col-MD-11 col-MD-offset-1 '按钮类型='submit' class='btn btn-primary '保存商品评价/button /div /div/form1 .创建一个差异即可。2.指定班级属性为拉蒂，为页面加载时初始化raty组件。3.指定名字为水平，作为传递到后台数据的参数的名字.4.指定当前引导验证程序的提出申请域为不是空的，表单提交时必须选中至少一个星。5.在差异中进行赋值，通过文本内容设置raty的值。

、初始化raty的差异

//找到raty的div$('div.raty '，$p).每个(function(){ var $ this=$(this)；好吃。调试(' div。raty‘$这个。选择器)；//获取初始化值var分数=$ this。text()；//置空这个。文本(')；//获取名字值，为后面引导验证程序的字段var name=$ this。attr(' name ')；//初始化raty $this.raty({ //设置值score : score，size : 24，Raty scoreName : name生成的隐藏字段的名称，//每当用户更改星级时，请重新验证它单击：函数(score，evt) { if ($this.parents().长度0) { //找到形式表单var $form=$this.parents().find('form.required-validate '，$ p)；if($ form)。长度0){ var data=$ form。数据(' bootstrapValidator ')；//如果有值，设置表单验证通过如果(分数0) { data.updateStatus(名称，' VALID ')；} } } } });});、后台获取

可直接通过水平从请求中进行获取。

整数级别=整数。Parseint(请求。getParameter(' level ')；

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。