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上的项目到这里,也欢迎各位提交项目给我们. 如果收录的项目有错误,可以通过 ...
随机推荐
- 第十六章 PHP 操作MySQL
学习要点:1.PHP 连接到MySQL2.增删改查3.其他常用函数 如果你已经具有了使用PHP.SQL 和MySQL 的丰富经验,现在就可以把所有这些技术组合在一起.PHP 与MySQL 之间稳固的集 ...
- Hadoop及子项目备注
Hadoop CommonHadoop体系最底层的一个模块,为Hadoop各子项目提供各种工具,如:配置文件和日志操作等. AvroAvro是doug cutting主持的RPC项目,有点类似Goog ...
- 数据库存储txt文本和jpg图片
环境:MySql+SQLyog+j2se+jdbc 存储文本用longtext类型 存储图片用blob类型 1.首先建表 create table t_t (id int(16) NOT NULL A ...
- JavaScript系列:函数 自执行 表达式 声明 定义
可用方式 (function($) {})(jQuery); !function( $ ){}(jQuery); +function( $ ){}(jQuery); -function( $ ){}( ...
- 红米note3的wifi断流或假死
红米note3的wifi断流/假死 日常使用note3的时,比如长时间浏览网页,点击一个链接会卡住不动,在等待十几秒之后才恢复.第一反应是不是网络不好?但是这种情况常常出现之后,对比其他的手机,比如价 ...
- 3DMark Sky Driver
Futuremark今天宣布,3DMark Sky Diver测试场景已经正式发布,现有用户可以免费更新. 3DMark的十几年历史上,这是第一次为某个版本增加全新的测试场景.升级后的3DMark版本 ...
- UITableview 多行删除
// RootViewController.m #import "RootViewController.h"#import "NextViewController.h& ...
- 西川善司【神秘海域(Uncharted)】的图形分析
本文是为传播0月8日发售的[神秘海域 合集]魅力而短篇连载的第2回,这次主要集中在神秘海域系列的图形的技术方面.原文链接在 http://weekly.ascii.jp/elem/000/ ...
- 关于DWZ模板中全选的使用
只在使用DWZ框架时有用 模板中 <input type="checkbox" name="rule_id[]" />选项1 <input t ...
- 达内培训:php在线端口扫描器
达内培训:php在线端口扫描器 [来源] 达内 [编辑] 达内 [时间]2012-12-21 这个扫描器很简单.就是用了一个数组来定义端口的相关信息,原理就是用fsockopen函数连接,如 ...