注册    登录
最新消息: 本以为花钱买了那个amh的板面可以让网站更稳定,结果搞得整 个网站运行出错,真是赔了夫人又折兵,对不起大家了。最新版jquery-2.1.1下载  ,在线的 jquery API使用手册, 稳定版jquery.mobile-1.3.2下载

基于jquery的Ajax星星评级/评分插件jRating

ajax fishcity 3523浏览

基于jquery的Ajax星星评级/评分插件jRating

jRating是一个非常灵活的可快速创建的基于jQuery的Ajax星星评级插件。jRating可以配置每个细节,从“星星的数量”到“星星是否代表小数“。jRating还有一个选项来显示小的或大的星星图像,你也可以使用自定义文件代替默认的星星图像。jRating支持任何脚本语言,但在github上的下载包中只包含了一个PHP的实例,其它语言的请自行制作。

使用方法

引入核心文件

<!-- CSS file -->
<link rel="stylesheet" type="text/css" href="jRating.jquery.css" media="screen" />
<!-- jQuery files -->
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jRating.jquery.js"></script>

创建html,基础实例

<!-- basic exemple -->
<div class="exemple">
 
   <!-- 12为平均值 1为更新到数据库的id标识 -->
   <div class="basic" data-average="12" data-id="1"></div>
 
    <!-- in this other exemple, 8 is the average and 2 is the id of the line to update in DB -->
   <div class="basic" data-average="8" data-id="2"></div>
 
</div>

写入JS调用插件

$(document).ready(function(){
      // 简单调用
      $(".basic").jRating();
 
      // 复杂点调用
      $(".basic").jRating({
         step:true,
         length : 20, // 星星的数量
         onSuccess : function(){
           alert('Success : 保存成功 :)');
         }
       });
 
      //评价三次后星星消失
      $(".basic").jRating({
         canRateAgain : true,
         nbRates : 3
       });
 
      // 点击触发评介 !
      $(".basic").jRating({
        onClick : function(element,rate) {
         alert(rate);
        }
      });
});

参数

名称 类型 默认值 描述
showRateInfo Boolean true 是否显示评价信息
bigStarsPath String jquery/icons/stars.png 大星星图片路径
smallStarsPath String jquery/icons/small.png 小星星图片路径
phpPath String php/jRating.php 服务端文件路径
type String big 外观类型
step Boolean false 设为true时一步一步填充星星
isDisabled Boolean false 设为true时评价信息隐藏
length Integer 5 星星的数量
decimalLength Integer 0 小数位数
rateMax Integer 20 星星最大数量
rateInfosX Integer 45 鼠标移动时相对于信息框的x轴绝对定位
rateInfosY Integer 5 鼠标移动时相对于信息框的y轴绝对定位
canRateAgain Boolean false 设为true,用户将修改之前的评介
nbRates Integer 1

可更改的次数

sendRequest Boolean true

发送数值给服务端

方法

名称 类型 返回值 描述
onSuccess Function  (element,rate)  评价成功时回调
onError Function  (element,rate)  评价出错时回调
onClick Function  (element,rate)  点击星星时回调

转载请注明:jQ酷 » 基于jquery的Ajax星星评级/评分插件jRating

下载地址:本站下载 | 百度云 | 官方下载
下载说明:
☉如果您发现本文件已经失效不能下载,请联系站长修正!
☉如果您下载的文件出现解压不了或文件受损等情况,请选择其他下载点重新下载。
☉下载本站资源,如果服务器暂不能下载请过一段时间重试!
☉有小部分资源需要解压密码,请输入:jqcool.net。
☉本站提供的所有资源仅供学习研究与参考,请勿用于商业用途。