javascript - 如何根据类和名称属性切换动态创建的 div ，修改？

Question

以下是我的参考代码：

$('#main_div').on('click','.gclass', function(){        
    $(this).css('color','#0088cc'); 
    if($(this).next().hasClass('gclass2') || $(this).next().next().hasClass('gclass3')){
        console.log('1st child or 2nd child');          
        $(this).parent().find('.gclass2,.gclass3').slideToggle();
    }   
    return false;
});

我动态创建了两个具有相同类“.gclass”的div。当我单击“.gclass”时，带有“.gclass2 和 .gclass3”的 div 将被切换。

当我单击 .gclass 类的一个 div 时，其他具有 .gclass 的 div 也会被切换，我不想这样做。

请有任何提示。

对于 CSS，我尝试过：

 $(".gclass").not(this).css("color", "#6e6e6e");        

但是对于slideToggle()可以做什么呢？

Answer 1

因为slideToggle()您可以编写自定义过滤器来过滤掉您的元素：

var that = this;
$(this).parent().find('.gclass2,.gclass3').filter(function() {
    return $(this).prev()[0] === that || $(this).prev().prev()[0] === that
}).slideToggle();

工作示例见这里：http: //jsbin.com/IjaboNE/1/edit