jq 根据值的正负变色
效果图这样:

意思就是根据最后的百分值变色,值为负变绿色,值为正变红色。
所以只要取到那个标签里的值了,就能根据正负的判断决定颜色。
我的html部分这样:
/*不过他们都说我的dom结构不太合理,同意。BUT,我就是不想写表格而写成的这样的,所以后面jq部分也要迁就了*/
<div class="pro_detail">
<!-- 列表详细信息 -->
<ul>
<li>001</li>
<li>椰香奶茶</li>
<li>¥ 10.00</li>
<li>¥ 10.50</li>
<li>-5%</li>
</ul>
</div>
思路就是:找到每个UL最后一个li,获取它的值,根据正负来判断。
但是,我刚刚想到,如果是0也是会变绿色,是不是要这样呢?
JQ部分代码这样:
// 根据正负值变色
function oChange(){
var oUl = $(".pro_detail ul").length;//有多少行,行的个数 for(var a = 0;a<oUl;a++){ var s = $(".pro_detail ul").eq(a).find('li').eq(4).html().replace(/%/, '');//除去 % 的数字内容
// alert(s);
if(s>0){ //如果值为正 后两个元素变红
$(".pro_detail ul").eq(a).find('li').eq(3).css({
"color" : "#ff6363"
});
$(".pro_detail ul").eq(a).find('li').eq(4).css({
"color" : "#ff6363"
});
}
else{
$(".pro_detail ul").eq(a).find('li').eq(3).css({
"color" : "#3ebb2b"
});
$(".pro_detail ul").eq(a).find('li').eq(4).css({
"color" : "#3ebb2b"
});
}
}//f
}//for
oChange();
jq 根据值的正负变色的更多相关文章
- SVM中为何间隔边界的值为正负1
在WB二面中,问到让讲一下SVM算法. 我回答的时候,直接答道线性分隔面将样本分为正负两类,取平行于线性切割面的两个面作为间隔边界,分别为:wx+b=1和wx+ b = -1. 面试官就问,为什么是正 ...
- radio值未出现JQ获取值问题
$('input:radio[name="modelExtend.manageType"]:checked').val(); 选中的获取的值不是空或者null而是on
- 怎么根据Comparable方法中的compareTo方法的返回值的正负 判断升序 还是 降序?
public int compareTo(Student o) { return this.age - o.age; // 比较年龄(年龄的升序) } 应该理解成return (-1)×(thi ...
- jQ实现图片无缝轮播
在铺页面的过程中,总是会遇到轮播图需要处理,一般我是会用swiper来制作,但总会有哪个几个个例需要我自己来写功能,这里制作了一个jq用来实现图片无缝轮播的dome,分享给大家ヽ( ̄▽ ̄)ノ. dom ...
- sql server日期字段值的比较
sql server中对日期字段值的比较 sql server中对日期字段的比较方式有多种,介绍几种常用的方式:用northwind库中的employees表作为用例表.1.between...and ...
- 使用padding值控制控件的隐藏与显示
在学自定义控件下拉刷新这一案例,控制ListView头条目和尾条目的显示隐藏时,就是设置其padding值的正负控制其的显示与隐藏.这并不是什么很大的知识点.只是一个小技巧,这里给大家分享一下. 这一 ...
- Javascript和jquery事件--鼠标滚轮事件WheelEvent
<1>js事件 滚轮事件在js中,不同浏览器还是有不同的,介于我只测试谷歌和火狐浏览器的情况,其他浏览器有待自行探索.有三种写法: target.onmousewheel = wheel; ...
- redis incr incrby decr decrby命令
incr.incrby.decr.decrby命令的作用和用法 redis中incr.incrby.decr.decrby属于string数据结构,它们是原子性递增或递减操作. incr递增1并返回递 ...
- 移动端图片随手势移动react组件(附移动开发小tips)
这个效果是公司产品中一个用到的效果,用于展示项目的信息,废话少说,先上效果图,代码在最后:),这个组件是在上篇博客中用webpack搭建的环境中完成的http://www.cnblogs.com/wu ...
随机推荐
- HAProxy介绍
简单说明 HAProxy提供高可用性.负载均衡以及基于TCP和HTTP应用的代理,支持虚拟主机,它是免费.快速并且可靠的一种解决方案.HAProxy特别适用于那些负载特大的web站点,这些站点通常又需 ...
- [译]Thinking in React
编者按 使用React的思想来构建应用对我在实际项目中以及帮助他人解决实际问题时起到了很大作用,所以我翻译此文来向那些正在或即将陷入React或React-Native深坑的同胞们表示慰问.网上已经有 ...
- nginx+php-fpm+mysql分离部署详解
相信大家将这三者部署到同一台主机应该已经不陌生了,今天在这里,给大家演示一下如何将三者部署到三台主机上. 实验系统:CentOS 6.6_x86_64 实验前提:大部分软件使用编译安装,请提前准备好编 ...
- [转]An introduction to OAuth 2.0 using Facebook in ASP.NET Core
本文转自:http://andrewlock.net/an-introduction-to-oauth-2-using-facebook-in-asp-net-core/ This is the ne ...
- ArrayIndexOutOfBoundsException
java.lang.ArrayIndexOutOfBoundsException: Array index out of range: 0 cusAndComs=this.getEm().create ...
- SQL Server数据库设计规范
数据库设计规范 1.简介 数据库设计是指对一个给定的应用环境,构造最优的数据库模式,建立数据库及其他应用系统,使之能有效地存储数据,满足各种用户的需求.数据库设计过程中命名规范很是重要,命名规范合理的 ...
- Underscore 整体架构浅析
前言 终于,楼主的「Underscore 源码解读系列」underscore-analysis 即将进入尾声,关注下 timeline 会发现楼主最近加快了解读速度.十一月,多事之秋,最近好多事情搞的 ...
- 动态生成验证码———MVC版
上面有篇博客也是写的验证码,但那个是适用于asp.net网站的. 今天想在MVC中实现验证码功能,弄了好久,最后还是看博友文章解决的,感谢那位博友. 首先引入生成验证码帮助类. ValidateCod ...
- Angularjs+node+Mysql实现地图上的多点标注
注:本文适合对于node有一定基础的人,如果您是小白,请先用1个小时学习node.node文档https://nodejs.org/en/docs/ 该片博文的源码地址:https://github. ...
- canvas检测边界和弹动的实例
如图所示的效果,小球相互碰撞会相互弹开,这时要干的事就只有两件事了,一:用二次循环遍历小球是否互相碰撞,二:碰撞之后会弹向什么地方和弹出多少距离,第一件事我想学过二维数组循环的都没问题,第二件事也只是 ...