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上的项目到这里,也欢迎各位提交项目给我们. 如果收录的项目有错误,可以通过 ...
随机推荐
- C#中的String.Format方法(转)
一.定义String.Format是将指定的 String类型的数据中的每个格式项替换为相应对象的值的文本等效项. 如: (1)string p1 = "Jackie";strin ...
- C Memory Layout C语言中的内存布局
在C语言中,内存的主要分为下列几部分: 1. Text/Code Segment 文本/代码区 2. Initialized Data Segments 初始化的数据区 3. Uninitialize ...
- 三星S4接电话黑屏无法挂断通话
最近发现S4的通话距离感应起出了问题,接电话后直接熄屏,按什么按钮都没有反应.通话结束后只能等对方挂断才会恢复正常,再或者长按9秒电源键强制重启.极大的影响了实用体验.网上搜了下,发现这样的问题还不少 ...
- hdu Waiting ten thousand years for Love
被这道题坑到了,如果单纯的模拟题目所给的步骤,就会出现同一个位置要走两次的情况...所以对于bfs来说会很头痛. 第一个代码是wa掉的代码,经过调试才知道这个wa的有点惨,因为前面的操作有可能会阻止后 ...
- Webscan360的防御与绕过
这两天给360做了一个webscan360的总结,结果补丁还没有出来,就被人公布到了91org上面,既然公开了,那我就做一个总结 首先我们贴上它最新的防御正则 \<.+javascript:wi ...
- php代码审计基础笔记
出处: 九零SEC连接:http://forum.90sec.org/forum.php?mod=viewthread&tid=8059 --------------------------- ...
- [转]Entity Framework走马观花之把握全局
本文转自:http://blog.csdn.net/bitfan/article/details/12887007 Entity Framework走马观花 之 把握全局 ============== ...
- GDUT——1169: Krito的讨伐(优先队列BFS)
1169: Krito的讨伐 Time Limit: 1 Sec Memory Limit: 128 MB Submit: 619 Solved: 102 Description Krito终于干 ...
- iOS 用宏定义写一个单例(Singleton)
用如下方法定义单例 @interface singleton_interface(ClassName); @end 实现单例在 @implemention singleton_implemention ...
- Sublime Text初识
一 基础安装1. 安装Package Control使用快捷键ctrl+`,调出输出窗口, 然后输入官网提供的代码, 获取代码地址:https://packagecontrol.io/installa ...