首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

jQuery超赞的评分插件（8款）

Posted in Javascript onAugust 20, 2015

本文跟大家分享了8款jQuery评分插件，相信总有一款是适合你的哦

抓紧先上图给大家挑选一下

------------------------------------------效果查看      源码下载------------------------------------------

jQuery超赞的评分插件（8款）

小编挺喜欢第一款的，亲，你呐？

为大家再分享实现8款jQuery评分插件代码，抓紧试试吧

<head>
<meta charset="gb2312">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>8款超赞的jQuery评分插件</title>
<meta name="description" content="">
<meta name="viewport" content="width=1024">
<link rel="stylesheet" href="css/normalize.min.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/examples.css">
<!--[if lt IE 9]>
 <script src="js/vendor/html5shiv.js"></script>
<![endif]-->
</head>
<body>
<section class="section section-examples">

 <div class="examples">

 <div class="row">
 <div class="col">

 <div class="box box-orange">
 <div class="box-header">Example A</div>
 <div class="box-body">
 <select id="example-a" name="rating">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7" selected="selected">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
 </select>
 </div>
 </div>

 </div>
 <div class="col">

 <div class="box box-green">
 <div class="box-header">Example B</div>
 <div class="box-body">
 <select id="example-b" name="rating">
  <option value="Bad">Bad</option>
  <option value="Mediocre">Mediocre</option>
  <option value="Good" selected="selected">Good</option>
  <option value="Awesome">Awesome</option>
 </select>
 </div>
 </div>

 </div>
 </div>

 <div class="row">
 <div class="col">

 <div class="box box-blue">
 <div class="box-header">Example C</div>
 <div class="box-body">
 <select id="example-c" name="rating">
  <option value=""></option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
 </select>
 </div>
 </div>

 </div>
 <div class="col">

 <div class="box box-orange">
 <div class="box-header">Example D</div>
 <div class="box-body">
 <select id="example-d" name="rating">
  <option value="1" data-html="<strong>1</strong>">1</option>
  <option value="2" data-html="<strong>2</strong>">2</option>
  <option value="3" data-html="<strong>3</strong>">3</option>
  <option value="4" data-html="<strong>4</strong>">4</option>
  <option value="5" data-html="<strong>5</strong>">5</option>
  <option value="6" data-html="<strong>6</strong>">6</option>
  <option value="7" data-html="<strong>7</strong>">7</option>
  <option value="8" data-html="<strong>8</strong>">8</option>
 </select>
 </div>
 </div>

 </div>
 </div>

 <div class="row">
 <div class="col">

 <div class="box box-green">
 <div class="box-header">Example E</div>
 <div class="box-body">
 <select id="example-e" name="rating">
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
  <option value="D">D</option>
  <option value="E">E</option>
  <option value="F">F</option>
 </select>
 </div>
 </div>

 </div>
 <div class="col">

 <div class="box box-blue">
 <div class="box-header">Example F</div>
 <div class="box-body">
 <select id="example-f" name="rating">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
 </select>
 </div>
 </div>

 </div>
 </div>

 <div class="row">
 <div class="col">

 <div class="box box-orange box-large">
 <div class="box-header">Example G</div>
 <div class="box-body">
 <select id="example-g" name="rating">
  <option value="Strongly Agree">Strongly Agree</option>
  <option value="Agree">Agree</option>
  <option value="Neither Agree or Disagree" selected="selected">Neither Agree or Disagree</option>
  <option value="Disagree">Disagree</option>
  <option value="Strongly Disagree">Strongly Disagree</option>
 </select>
 </div>
 </div>

 </div>
 <div class="col">

 <div class="box box-green box-large">
 <div class="box-header">Example H</div>
 <div class="box-body">
 <select id="example-h" name="rating">
  <option value="10">10</option>
  <option value="9">9</option>
  <option value="8">8</option>
  <option value="7">7</option>
  <option value="6">6</option>
  <option value="5">5</option>
  <option value="4">4</option>
  <option value="3">3</option>
  <option value="2">2</option>
  <option value="1" selected="selected">1</option>
 </select>
 </div>
 </div>

 </div>
 </div>

 </div>

</section>

<script src="js/vendor/jquery-1.11.2.min.js"></script> 
<script src="js/jquery.barrating.js"></script>
<script src="js/examples.js"></script>

<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>
</body>
</html>

以上就是以上就是为大家分享的jQuery超赞的评分插件代码，希望大家可以喜欢。

jQuery超赞的评分插件（8款）

- Author -

lijiao

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
extJs 常用到的增，删，改，查操作代码
Dec 28 Javascript
基于JQuery 滑动与动画的说明介绍
Apr 18 Javascript
JavaScript中按位“异或”运算符使用介绍
Mar 14 Javascript
JavaScript实现仿淘宝商品购买数量的增减效果
Jan 22 Javascript
通过node-mysql搭建Windows+Node.js+MySQL环境的教程
Mar 01 Javascript
Angular使用$http.jsonp发送跨站请求的方法
Mar 16 Javascript
JS+Canvas绘制动态时钟效果
Nov 10 Javascript
JS如何获取地址栏的参数实例讲解
Oct 06 Javascript
layui前端时间戳转化实例
Nov 15 Javascript
vue data变量相互赋值后被实时同步的解决步骤
Aug 05 Javascript
在vue中封装方法以及多处引用该方法详解
Aug 14 Javascript
通过实例解析js可枚举属性与不可枚举属性
Dec 02 Javascript
jQuery网页版打砖块小游戏源码分享
Aug 20 #Javascript
js实现鼠标点击文本框自动选中内容的方法
Aug 20 #Javascript
js实现文字在按钮上滚动的方法
Aug 20 #Javascript
jquery实现漫天雪花飞舞的圣诞祝福雪花效果代码分享
Aug 20 #Javascript
js实现网页多级级联菜单代码
Aug 20 #Javascript
javascript常用的方法整理
Aug 20 #Javascript
JS实现的Select三级下拉菜单代码
Aug 20 #Javascript
Counter(1) pip(1) 爬虫(2) Xpath(1) most_common(1) 字典(3) 抖音(1) 写入策略(1) LOGO(1) MIME(1)
You might like
PHP获取一年中每个星期的开始和结束日期的方法
2015/02/12 PHP
PHP获取路径和目录的方法总结【必看篇】
2017/03/04 PHP
实例分析10个PHP常见安全问题
2019/07/09 PHP
PHP7数组的底层实现示例
2019/08/25 PHP
Javascript表单验证要注意的事项
2014/09/29 Javascript
Windows系统下Node.js的简单入门教程
2015/06/23 Javascript
使用伪命名空间封装保护独自创建的对象方法
2016/08/04 Javascript
用vue的双向绑定简单实现一个todo-list的示例代码
2017/08/03 Javascript
利用原生的JavaScript实现简单拼图游戏
2018/11/18 Javascript
js字符串类型String常用操作实例总结
2019/07/05 Javascript
ES6 新增的创建数组的方法(小结)
2019/08/01 Javascript
[09:22]2014DOTA2西雅图国际邀请赛 主赛事第二日TOPPLAY
2014/07/21 DOTA
[01:05]DOTA2完美大师赛趣味视频之选手教你打职业
2017/11/23 DOTA
以一段代码为实例快速入门Python2.7
2015/03/31 Python
详解Python发送邮件实例
2016/01/10 Python
学习python类方法与对象方法
2016/03/15 Python
Python基于select实现的socket服务器
2016/04/13 Python
python使用os.listdir和os.walk获得文件的路径的方法
2017/12/16 Python
Python根据指定日期计算后n天，前n天是哪一天的方法
2018/05/29 Python
Python实现读取SQLServer数据并插入到MongoDB数据库的方法示例
2018/06/09 Python
python 判断矩阵中每行非零个数的方法
2019/01/26 Python
Django 通过JS实现ajax过程详解
2019/07/30 Python
Django项目使用ckeditor详解(不使用admin)
2019/12/17 Python
安装多个版本的TensorFlow的方法步骤
2020/04/21 Python
python打开音乐文件的实例方法
2020/07/21 Python
通信工程专业毕业生推荐信
2013/12/25 职场文书
中秋节超市促销方案
2014/01/30 职场文书
捐款感谢信
2015/01/20 职场文书
党员个人总结自评
2015/02/14 职场文书
销售员岗位职责范本
2015/04/11 职场文书
高中生物教学反思
2016/02/20 职场文书
IDEA 链接Mysql数据库并执行查询操作的完整代码
2021/05/20 MySQL
win11怎么用快捷键锁屏? windows11锁屏的几种方法
2021/11/21 数码科技
Redis中缓存穿透/击穿/雪崩问题和解决方法
2021/12/04 Redis
SpringBoot中HttpSessionListener的简单使用方式
2022/03/17 Java/Android
关于Vue中的options选项
2022/03/22 Vue.js