JQ五星好评效果
$(".list-txt ul").find("li").click(function(){
if($(this).index()==0){
if($(this).hasClass("start")){
$(this).parents("ul").find("li").eq(1).removeClass("start");
$(this).parents("ul").find("li").eq(2).removeClass("start");
$(this).parents("ul").find("li").eq(3).removeClass("start");
$(this).parents("ul").find("li").eq(4).removeClass("start");
}else{
$(this).addClass("start");
}
};
if($(this).index()==1){
if($(this).hasClass("start")){
$(this).parents("ul").find("li").eq(2).removeClass("start");
$(this).parents("ul").find("li").eq(3).removeClass("start");
$(this).parents("ul").find("li").eq(4).removeClass("start");
}else{
$(this).addClass("start");
$(this).parents("ul").find("li").eq(0).addClass("start");
}
};
if($(this).index()==2){
if($(this).hasClass("start")){
$(this).parents("ul").find("li").eq(3).removeClass("start");
$(this).parents("ul").find("li").eq(4).removeClass("start");
}else{
$(this).addClass("start");
$(this).parents("ul").find("li").eq(0).addClass("start");
$(this).parents("ul").find("li").eq(1).addClass("start");
}
};
if($(this).index()==3){
if($(this).hasClass("start")){
$(this).parents("ul").find("li").eq(4).removeClass("start");
}else{
$(this).addClass("start");
$(this).parents("ul").find("li").eq(0).addClass("start");
$(this).parents("ul").find("li").eq(1).addClass("start");
$(this).parents("ul").find("li").eq(2).addClass("start");
}
};
if($(this).index()==4){
if($(this).hasClass("start")){
}else{
$(this).addClass("start");
$(this).parents("ul").find("li").eq(0).addClass("start");
$(this).parents("ul").find("li").eq(1).addClass("start");
$(this).parents("ul").find("li").eq(2).addClass("start");
$(this).parents("ul").find("li").eq(3).addClass("start");
}
};
var num=$(this).parents("ul").find(".start").length;
$(this).parents(".list-txt").find("input").val(num)
})
JQ五星好评效果的更多相关文章
- 如何用jQuery实现五星好评
jQuery是js的一个库,封装了我们开发过程中常用的一些功能,方便我们来调用,提高了我们的开发效率. Js库是把我们常用的功能放到一个单独的文件中,我们用的时候,直接引用到页面里面来就可以了. 接下 ...
- jQuery实现简单的五星好评
最近一直在认真的努力工作,今天工作完成得差不多了,比较轻松点,在工作中有遇到用jq实现五星好评功能,觉得简单又有用,所以空闲时间就想分享出来. css部分: <style> .u_star ...
- 亲,麻烦给个五星好评!—RatingBar
引言 上一篇的CheckBox已经让大家越来越接近实战演练了,本章我们继续分享干货给大家,今天介绍一个实用的UI控件RatingBar(星级评分条),对于使用过电商APP(某东,某宝等)的小伙伴们来说 ...
- JQ实现弹幕效果
JQ实现弹幕效果,快来吐糟你的想法吧 效果图: 代码如下,复制即可使用: <!DOCTYPE html> <html> <head> <meta charse ...
- js五星好评
一般我们在一些购物以及美食的网站都会看到五星好评之类的,一下是使用js制作的五星好评! <!DOCTYPE html> <html lang="en"> & ...
- 修改css样式+jq中的效果+属性操作+元素操作
:checked 选框选中的 一.修改css样式: 1.参数只写属性名,则返回属性值 $(this).css( ' color '); //300px 2.参数是属性名,属性值,逗号分隔,是 ...
- 五星评分效果 原生js
五星评分在很多地方都可以用到,网上也有插件或者相应的代码,在这里我给大家提供一款我自己写的超级简单实用的五星评分代码,连图片都不需要 <!-- 评分start --> <ul> ...
- 今天讲的是JQ 的动画效果
老规矩,先贴代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- jq菜单折叠效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
随机推荐
- iOS 10.10 10.11 10.12 安装升级CocoPods
CocoPods简介 CocoaPods是一个用Ruby写的,负责管理iOS以及OSX系统下的一个第三方类库管理工具,通过CocoaPods,我们可以集中,统一的管理第三方开源库.当然这些库徐亚Coc ...
- linux --> Linux变量之$#, $*, $@含义
Linux变量之$#, $*, $@含义 一.介绍 $# //是传给脚本的参数个数 $ //是脚本本身的名字 $1 //是传递给该shell脚本的第一个参数 $ //是传递给该shell脚本的第二个参 ...
- Java集合:TreeMap源码剖析
一.概念 TreeMap是基于红黑树结构实现的一种Map,要分析TreeMap的实现首先就要对红黑树有所了解. 要了解什么是红黑树,就要了解它的存在主要是为了解决什么问题,对比其他数据结构比如数组,链 ...
- easyUi五个常用插件
1.对话框(Dialog) 对话框(dialog)是一个特殊类型的窗口,它在顶部有一个工具栏,在底部有一个按钮栏.默认情况下,对话框(dialog)只有一个显示在头部右侧的关闭工具.用户可以配置对话框 ...
- 设计模式之 原型模式详解(clone方法源码的简单剖析)
作者:zuoxiaolong8810(左潇龙),转载请注明出处,特别说明:本博文来自博主原博客,为保证新博客中博文的完整性,特复制到此留存,如需转载请注明新博客地址即可. 原型模式算是JAVA中最简单 ...
- Spring Boot 入门教程
Spring Boot 入门教程,包含且不仅限于使用Spring Boot构建API.使用Thymeleaf模板引擎以及Freemarker模板引擎渲染视图.使用MyBatis操作数据库等等.本教程示 ...
- Django+xadmin打造在线教育平台(十)
十四.xadmin的进阶开发 14.1.权限管理 (1)用户权限 超级用户拥有所有权限,其它添加的用户默认没有任何权限 进后台添加一个用户“Editor1”,勾上“职员状态”后,这个用户才可以登录进后 ...
- 凡事预则立-于Beta冲刺前
凡事预则立,在Beta开始前的描述 在Beta项目冲刺开始之前,我们小组组织了一次活动室的讨论,明确了一下分工和即将来临的Beta冲刺要处理的问题和需要继续改进的地方.顺带补上一直没有的照片: 针对几 ...
- 掌握SQLServer锁的相关概念
一.为什么要引入锁 当多个用户同时对数据库的并发操作时会带来以下数据不一致的问题: ◆丢失更新 A,B两个用户读同一数据并进行修改,其中一个用户的修改结果破坏了另一个修改的结果,比如订票系统 ◆脏读 ...
- 项目Alpha冲刺Day10
一.会议照片 二.项目进展 1.今日安排 解决前后台联调问题,完善全局的请求和路由跳转处理,添加空文件完善路由信息,优化界面跳转等待.完成个人信息和修改密码.修改前台数据组织和方法调用方式.解决登录和 ...