基于jquery.raty.js实现星星评分展示

jquery.raty.js星星评分实现步骤

首先，需要在项目中引入jquery.js文件，确保jQuery库已正确加载。

接着，引入jquery.raty.js插件文件，以支持星星评分功能。

在页面HTML结构中，添加一个带有readOnly类的span元素，并通过data-path属性指定图片路径，内部包含一个i标签用于存储评分数值，例如：<span class="readOnly" data-path="images" ><i>4.5</i></span>。

编写JavaScript代码，定义star函数，该函数接收选择器和评分数值作为参数。在函数内部，调用$(obj).raty()方法，配置path属性以动态获取图片路径，设置readOnly为true表示只读模式，并将score设置为传入的数值。最后，获取页面中.starr元素下i标签的文本内容，调用star函数初始化评分展示。

function star(obj,num){
 $(obj).raty({
 path: function() {
  return this.getAttribute('data-path');//路径
  },
 readOnly: true,
 score: num //(starr)这个4.5就是星星右边的数值
 });
};
var ac = $('.starr').find('i').text();
star('.readOnly',ac);

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持本站！