rank 和 星星评级
我们常常看到打分,如下图
这样的效果有几种方法
1.用:lt(index)
/* $('dl').each(function(){ var ths = $(this); $(this).find('dd').click(function(){ ths.find('dd').removeClass('selected'); ths.find('dd:lt('+ ($(this).index()+1) +')').addClass('selected'); }).dblclick(function(){ $(this).removeClass('selected'); }) }); */ $('dd').click(function(){ var num = $(this).index(); $('dd').removeClass('selected');//先移除所有的效果 $('dd:lt('+(num+1)+')').addClass('selected');//小于这个index的dd执行 }).dblclick(function(){//双击 $('dd').removeClass('selected'); }); })
2prevAll()和nextAll()方法的结合
$(function(){ $("dd").click(function(){ $(this).addClass("selected"); $(this).prevAll().addClass("selected"); $(this).nextAll().removeClass("selected"); }); $("dd").dblclick(function(){ $("dd").removeClass("selected"); }););
rank 和 星星评级的更多相关文章
- js点亮星星评分并获取参数的js代码
点亮星星评分后,点击按钮,立即获得分数参数值,方便不想使用ajax传参的朋友 http://demo.jb51.net/js/2014/jsxxdf/demo2.html <!DOCTYPE h ...
- 关于inline-block的间隙问题
很久之前写过一个星星评级的样式,当时开发人员在嵌套代码的时候出现很多问题,同样的一个样式有的页面正常有的页面就出现星星错位的问题,仔细研究了一下代码,发现问题原来出在了inline-block上. 目 ...
- Vue应用框架整合与实战--Vue技术生态圈篇
实用框架以及工具 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 Element-UI ★13489 - 饿了么出品的Vue2的web UI工具套件 Vux ★8133 ...
- 【转载】 github vue 高星项目
内容 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 element ★13489 - 饿了么出品的Vue2的web UI工具套件 Vux ★8133 - 基于Vue和 ...
- VUE组件汇总
内容 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 element ★13489 - 饿了么出品的Vue2的web UI工具套件 Vux ★8133 - 基于Vue和 ...
- 【分享】Vue 资源典藏(UI组件、开发框架、服务端、辅助工具、应用实例、Demo示例)
Vue 资源典藏,包括:UI组件 开发框架 服务端 辅助工具 应用实例 Demo示例 element ★11612 - 饿了么出品的Vue2的web UI工具套件 Vux ★7503 - 基于Vue和 ...
- Vue开源项目汇总(史上最全)(转)
目录 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 element ★13489 - 饿了么出品的Vue2的web UI工具套件 Vux ★8133 - 基于Vue和 ...
- vue(6)生态
来自:https://www.jianshu.com/p/22a99426b524?utm_campaign=maleskine&utm_content=note&utm_medium ...
- Vue相关开源项目库汇总 http://www.opendigg.com/tags/front-vue
awesome-github-vue 是由OpenDigg整理并维护的Vue相关开源项目库集合.我们会定期同步OpenDigg上的项目到这里,也欢迎各位提交项目给我们. 如果收录的项目有错误,可以通过 ...
随机推荐
- js for循环,为什么一定要加var定义i变量
我知道,有些人(譬如之前的我)写js的for循环时,都不习惯加上var,这当然是语法允许的.譬如下面. for(i=0;i<10;i++){//就不写成: var i=0 alert(i); } ...
- 查看GCC编译C的中间代码
小测试,记录一下命令 XD 一.C程序源码(code.c): 二.中间代码 由 gcc -fdump-tree-all code.c 得到 查看 code.c.012t.cfg 三.汇编级代码 (64 ...
- Intent学习笔记
Intent首先字面意思大概是意图.负责activity之间或者,activity与service等(我只知道这么点)之间信息的传递.就跟快递员起的作用差不多(我这这么理解),由一下六部分组成: Co ...
- 记save函数
在写商品修改的代码的时候,我使用到了create()函数,也使用到了save函数.但是我从表单接受过来的数据,在添加语句的时候都没成功.代码如下 function upd($goods_id){ $g ...
- ThinkPHP几个配置文件的位置
1.常用的ThinkPHP\Conf\convention.php 2.ThinkPHP/Lib/Behavior/ParseTemplateBehavior.class.php模板引擎相关配置
- 免杀ASP一句话
<% wei="日日日)""wei""(tseuqer lave 日" execute(UnEncode(wei)) function ...
- mongodb复制集配置
#more /opt/mongodb3.0/mongodb_im_conf_47020/mongodb3.0_im_47020.cnf dbpath = /opt/mongodb3.0/mongodb ...
- axure rp extension的下载
使用chrome无法直接打开axure制作的prd文档,需要下载相关插件.平时用的shadowsocksFQ软件,登录chrome的网上应用商店,确发现无法正常下载, 于是通过其他途径下载了改插件,拖 ...
- 换行符javajava去除字符串中的空格、回车、换行符、制表符
在改章节中,我们主要介绍换行符java的内容,自我感觉有个不错的建议和大家分享下 每日一道理 只有启程,才会到达理想和目的地,只有拼搏,才会获得辉煌的成功,只有播种,才会有收获.只有追求,才会 ...
- Solve one floodlight install problem
参考: Floodlight安装 SDNLAB Floodlight官网 Installation Guide 问题: 在follow安装教程安装Floodlight的过程中,ant编译时出现了: [ ...