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");
                    }
                });
            }) 
  • 相关阅读:
    [转]浏览器退出之后php还会继续执行么?
    vim常用命令
    [转]自己写PHP扩展之创建一个类
    [转]用C/C++扩展PHP详解
    [转]PHP的执行流程,PHP扩展加载过程
    用扩展开发一个PHP类
    gcc
    Linux常用网络命令
    TCP-IP详解学习笔记1
    在Linux中调试段错误(core dumped)
  • 原文地址:https://www.cnblogs.com/FanJava/p/9078656.html
Copyright © 2011-2022 走看看