使用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");
                }
            });
        }) 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM