zoukankan      html  css  js  c++  java
  • 使用jquery实现获取除this(当前选定)以外的元素

    今天做项目时,要求完成功能评价的分类,即好评,差评,中评。遇到一个问题,如何在选定一个评论类型时,该div颜色改变,其他评论类型的div颜色不变。

    在使用$(this).attr()时,表示当前元素的某一属性,而要获取其他元素的属性
    使用siblings方法。
    $(this).siblings().attr()
    <div class='evaluate-nav clearfix' id="evaluate">
                    <div class='e-nav-item f-l on' id="allEvaluate">
                        <span>全部评价</span>
                        <span id="ae"></span>
                    </div>
                    <div class='e-nav-item f-l' id="goodEvaluate">
                        <span>好评</span>
                        <span id="ge"></span>
                    </div>
                    <div class='e-nav-item f-l' id="midEvaluate">
                        <span>中评</span>
                        <span id="me"></span>
                    </div>
                    <div class='e-nav-item f-l' id="badEvaluate">
                        <span>差评</span>
                        <span id="be"></span>
                    </div>
                </div>
    $("#evaluate").on('click','div',function(e){
                e.preventDefault();
                var idA = $(this).attr('id');
                var scoreType = 0;
                if (idA == "allEvaluate") {
                    scoreType = null;
                    $(this).attr('class','e-nav-item f-l on');
                    $(this).siblings().attr('class','e-nav-item f-l');
                } else if (idA == "midEvaluate") {
                    scoreType = 1;
                    $(this).attr('class','e-nav-item f-l on');
                    $(this).siblings().attr('class','e-nav-item f-l');
                } else if (idA == "badEvaluate") {
                    scoreType = 2;
                    $(this).attr('class','e-nav-item f-l on');
                    $(this).siblings().attr('class','e-nav-item f-l');
                } else if (idA == "goodEvaluate") {
                    $(this).attr('class','e-nav-item f-l on');
                    $(this).siblings().attr('class','e-nav-item f-l');
                }
                $.fd.ajax({
                    url : 'api/scores',
                    type: 'get',
                    async: true,
                    data : {start:0,length:10,condition:{productId:id,scoreType:scoreType}},
                    success: function(d) {
                        //清空数据
                        $(".evaluate-list").empty();
                        //显示数据
                        $(".evaluate-list").getEvaluate({
                            maxNum:5
                        },d.data.data);
                        $("#checkEvaluate").modal("show");
                    }
                });
            }) 
  • 相关阅读:
    《代码大全2》读书笔记 Week3
    华莱士 勇敢的心 值得一看的电影
    验证sqlserver 不区分大小写
    sql 分割函数
    子报表设置数据源 指定子报表数据 可以预防报表显示错误的问题
    linq 实现 tsql里的 in 和not in的功能
    水晶报表参数构建和数据传入显示函数
    .net 发邮件带附件源码
    将C#的dll文件反编译成il文件工具
    sp_executesql介绍和使用
  • 原文地址:https://www.cnblogs.com/FanJava/p/9078656.html
Copyright © 2011-2022 走看看