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();

 

posted @ 2016-02-21 23:41  解颐的奇异果  阅读(485)  评论(0编辑  收藏  举报