js插件---评分插件Rating如何使用

一、总结

一句话总结：form下的input和a标签，input记录值，a标签显示样式

12 <form data-am-rating>

13   <input type="hidden" name="score">

14   <a class="am-padding-lg" data-am-icons="heart-o,heart" data-am-score="2" role="button">

15     <i class="am-icon-heart"></i>

16     <i class="am-icon-heart"></i>

17     <i class="am-icon-heart-o"></i>

18     <i class="am-icon-heart-o"></i>

19     <i class="am-icon-heart-o"></i>

20  </a>

21 </form>

1、Rating选好评分后评分的值在哪？

在input上，把一个个小星星设置为button后，选星级的时候自动传值过去了，所以可以用ajax

二、评分插件Rating如何使用

1、截图

 

2、代码

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

     <link rel="stylesheet" href="../css/amazeui.min.css">

     <script src="../js/jquery.min.js"></script>

     <script src="../js/amazeui.min.js"></script>

     <script src="amazeui-rating-master/dist/amazeui.rating.min.js"></script>

 </head>

 <body>

 <form data-am-rating>

   <input type="hidden" name="score">

   <a class="am-padding-lg" data-am-icons="heart-o,heart" data-am-score="2" role="button">

     <i class="am-icon-heart"></i>

     <i class="am-icon-heart"></i>

     <i class="am-icon-heart-o"></i>

     <i class="am-icon-heart-o"></i>

     <i class="am-icon-heart-o"></i>

  </a>

 </form>

 </body>

 </html>
 

js插件---评分插件Rating如何使用的更多相关文章

  1. js星星评分插件

    下载:https://files.cnblogs.com/files/wordblog/%E6%98%9F%E6%98%9F%E6%8F%92%E4%BB%B6.rar

  2. jquery评分插件jquery.raty.js

    1.参考链接 官方地址. 教程一 教程二 2.案例1 引入文件: <!-- 评分插件 --> <script type="text/javascript" src ...

  3. HTML5商城开发三 jquery 星星评分插件

    展示:

  4. 一款好用的jquery评分插件

    一．使用说明 1.jQuery评分插件的功能: 图标显示用户评分,更美观 可实时点击,切换评分 返回用户评分,记录用户评分 实现类似下图效果 2.优点: 美观,方便 3.缺点: 只能用于jquery开 ...

  5. jQuery 评分插件(转)

    评分效果的小插件jQuery Raty.它提供的API相当丰富真的是让人爱不释手.详细文档及下载插件请移步这里. 基本使用 下面我们来实际操作,运用一下这个有爱的小插件. 需要做的事情非常简单,在页面 ...

  6. 基于jQuery8款超赞的评分插件

    基于jquery8款超赞的评分插件.这是一款基于jquery.barrating插件实现的,该评级小部件可灵活设置CSS样式.具体效果请查看演示.效果图如下: 在线预览   源码下载 实现的代码. h ...

  7. 一个非常棒的jQuery 评分插件--好东西要分享

    现在做网页已经不仅限于实现功能了,更多的是要实现功能的同时追求更加美观的实现.比如页面上让用户评分的功能,你完全可以放5个RdioButton让用户选择分数,也可以用DropDownList来实现,但 ...

  8. 给Chrome和Firefox添加js脚本作为插件的方法

    为了防止无良网站的爬虫抓取文章,特此标识,转载请注明文章出处.LaplaceDemon/ShiJiaqi. http://www.cnblogs.com/shijiaqi1066/p/5973141. ...

  9. 原生js日期时间插件鼠标点击文本框弹出日期时间表格选择日期时间

    原文出处 (这是我从互联网上搜来的,感觉能满足各方面的需求.个人感觉挺不错的,所以后期修改了一下向大家推荐!) 效果图: html代码: <!DOCTYPE html PUBLIC " ...

随机推荐

  1. Java类和对象11

    首先,编写一个类ChongZai,该类中有3个重载的方法void print():其次,再编写一个主类来测试ChongZai类的功能. public class ChongZai { public v ...

  2. studyLink

    http://order.csdn.net/myorder/detail?id=850343 csdn

  3. php八大设计模式之装饰器模式

    我们都知道,得到一匹布需要大概这么几步: 1.染色 2.印花 3.裁剪 这种形式在面向对象中怎么实现呢? 面向过程[继承模式]实现: 继承模式得到需要的布料,一步一步的加工. 继承的层次越来越深,扩展 ...

  4. oracle创建静态监听

    [oracle@localhost admin]$ pwd /u01/app/oracle/product/11.2.0/dbhome_1/network/admin [oracle@localhos ...

  5. sed命令的介绍

    命令格式 sed [options] 'command' file(s) sed [options] -f scriptfile file(s) 选项 -e<script>或--expre ...

  6. 05-数据类型转换（bool转换）

    05-数据类型转换(bool转换)

  7. 洛谷 P1056 排座椅

    P1056 排座椅 题目描述 上课的时候总会有一些同学和前后左右的人交头接耳,这是令小学班主任十分头疼的一件事情.不过,班主任小雪发现了一些有趣的现象,当同学们的座次确定下来之后,只有有限的D对同学上 ...

  8. 利用NSProxy解决NSTimer内存泄漏问题

    之前写过一篇利用RunTime解决由NSTimer导致的内存泄漏的文章,最近和同事讨论觉得这样写有点复杂,然后发现有NSProxy这么好用的根类,根类,根类,没错NSProxy与NSObject一样是 ...

  9. [Python] Histograms for analysis Daily return

    A histogram is an accurate representation of the distribution of numerical data. Y axis is the occur ...

  10. 基于请求响应的MVC框架调用分析

    一.使用Servlet来处理请求响应 当client提交数据之后.接着发送请求,请求被封装成对象,server接收到请求,依据请求的URL.来推断将请求对象交由哪个Servlet处理. 在servle ...