具有相同类的多个 div 的特定 div 的 CSS

Question

我有多个具有同一类的 div。 当用户点击一个 div 时，我有一个 slidetoggle()，我有两个按钮“接受”和“拒绝”。现在，当用户单击接受或拒绝时，我希望该特定 div 根据接受或拒绝将颜色更改为绿色或红色。

但是当我尝试分配颜色时，所有 div 都会改变颜色。

有没有办法改变特定div的颜色。

$(document).on("pagecreate","#one1",function(){
    $("div.comp2").on("tap",function(){
    $("#panel").slideToggle("slow", function(){
        $("#accept").on("click",function(){
            $("div.comp2").css("background-color","#22bb45"); 
        });
    });
    });
});

Answer 1

在事件处理程序中，您可以使用this 关键字仅引用引发事件的元素，而不是按类选择所有元素。试试这个：

$(document).on("pagecreate","#one1",function(){
    $("div.comp2").on("tap", function() {
        var $comp2 = $(this);
        $("#panel").slideToggle("slow", function(){
            $("#accept").on("click", function(){
                $comp2.css("background-color","#22bb45"); 
            });
        });
    });
});

Answer 2

$(document).on("pagecreate","#one1",function(){
    $("div.comp2").on("tap",function(){
    var __this = this;
    $("#panel").slideToggle("slow", function(){
        $("#accept").on("click",function(){
            $(__this).css("background-color","#22bb45"); 
        });
    });
    });
});