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" ...
随机推荐
- python socket编程制作后门木马(原创)
不知道为啥,懒得解释怎么写出来的,直接上代码,爱看不看 Client: 简单连接服务器 #!/usr/bin/python #coding:utf-8 import socket import sy ...
- 实现Windows数据绑定
dataSet数据集 dataset驻留于内存临时存储数据简单的理解为一个临时数据库将数据源的数据保存在内存中独立于任何数据库创建dataset对象引入命名空间:system.Datadatase ...
- 解决NSURLConnection finished with error - code -1100错误
更新到xcode9以后,拖进工程中一个html文件,webview加载这个文件,xcode一直抛出 NSURLConnection finished with error - code -1100异常 ...
- Mybatis学习笔记一
Mybatis介绍 MyBatis 本是apache的一个开源项目iBatis, 2010年这个项目由apache software foundation 迁移到了google code,并且改名为M ...
- 解决办法:由于oracle版本不同导致导入数据时失败
在向一个数据库导入dmp文件时,出现了如下错误 经查询,是由于"导出的dmp文件与导入的数据库的版本不同造成的" 用notepad查看dmp文件的版本,看看是否和数据库版本一致 解 ...
- 第十四,十五周PTA作业
1.第十四周part1 7-3 #include<stdio.h> int main() { int n; scanf("%d",&n); int a[n]; ...
- Beta总结
45°炸 031502601 蔡鸿杰 031502604 陈甘霖 031502632 伍晨薇 一.写在Beta项目前 Beta 凡 事 预 则 立 二.GitHub传送门 Beta冲刺重要版本 三.用 ...
- Alpha冲刺Day9
Alpha冲刺Day9 一:站立式会议 今日安排: 经过为期5天的冲刺,基本完成企业人员模块的开发.因第三方机构与企业存在委托的关系.第三方人员对于风险的自查.风险列表的展示以及自查风险的统计展示(包 ...
- 201621123044 《Java程序设计》第六周实验总结
1. 本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图或相关笔记,对面向对象思想进行一个总结. 注1:关键词与内容不求多,但概念之间的联系要清晰 ...
- class AClass<E extends Comparable>与class AClass<E extends Comaprable<E>>有什么区别?
new ArrayList<>()与new ArrayList()一样 都是为了做限定用的 如果不了解你可以看API 这个Comparable里面有一个方法compareTo(T o) 如 ...