Question

我想在所有具有“someClass”类的元素中添加一个名为“group”的类 - 但仅限于，例如：

<div class="someClass">SomeText</div>
<div class="someClass">SomeOtherText</div>
<div class="someOtherClass">SomeMoreText</div>
<div class="someOtherClass">SomeMoreOtherText</div>

如果用户点击包含“someClass”类的div，则应该变为以下内容：

<div class="someClass group">SomeText</div>
<div class="someClass group">SomeOtherText</div>
<div class="someOtherClass">SomeMoreText</div>
<div class="someOtherClass">SomeMoreOtherText</div>

如果用户点击包含“someOtherClass”的div，那么应该添加“group”类。

我尝试了以下jQuery - 失败了：

$("#someId").live("click", function() {    
    var selectedClass;
    selectedClass = $(this).attr('class');

    $('.'+selectedClass).addClass('group');
    //...followed by more jQuery...
});

我也试过我的运气：

$("#someId").live("click", function() {    
    $(this).attr('class').addClass('group');
    //...followed by more jQuery...
});

......也没用:(

Answer 1

你应该考虑到div有多个类的可能性 - 只要连续两次点击div就会发生这种情况：

$('div').on('click',function(e) {
    var cl = $(this).attr('class'),
        carr = cl.split(/\s+/);
    for (var i=0; i<carr.length; i++) {
        $('div.'+carr[i]).addClass('newclass');
    };
});

http://jsfiddle.net/FcXu5/

Answer 2

$('div').click(function() {    
    var selectedClass;
    selectedClass = $(this).attr('class');
    $('.'+selectedClass).addClass('group');
});

http://fiddle.jshell.net/H3hs9/1/

喜欢那个？

Answer 3

假设点击的div只有一个类：

$('div').click(function(){
  $('.group').removeClass('group'); //assuming you want this
  $('.'+this.className).addClass('group');
});

如果他们可能有很多：

$('div').click(function(){
  $('.group').removeClass('group'); //assuming you want this
  var classes = this.className.split(/\s+/);
  var select  = $.map(classes,function(c){ return "."+c }).join();
  $(select).addClass('group');
});

Answer 4

试试这个

$(document).ready(function(){
        $('.someClass').on('click',function(){
            var $this = $(this);
            if($this.attr('class')=='someClass'){
            $this.addClass('group');
            }
        });
    });

Answer 5

我的解决方案使用了一种打开和关闭课程的方法。

HTML

<div class="item someclass">Hello</div>
<div class="item someclass">Hello</div>
<div class="item someclass">Hello</div>
<div class="item someclass">Hello</div>
<div class="item someclass">Hello</div>
<div class="item someclass">Hello</div>

CSS

.group{
color:green;
}

JS

jQuery('.item').click(function(){

    if(!jQuery(this).hasClass('group')){
    jQuery(this).addClass('group')
    }
    else
    {
    jQuery(this).removeClass('group')
    }
    });

当你点击一个带有“item”类的元素时，它会搜索是否有“group”类。如果为true，则删除该类，如果为false，则添加该类。

使用带有“item”元素的div上的click事件，当你只想添加具有特定元素组的类时，这是很好的。

这里的小提琴

http://jsfiddle.net/nNS44/

Answer 6

 $(document).ready(function(){
        $('.someOtherClass').on('click',function(){
            $('.someClass').addClass('group');

        });
    });

jsfiddle：http://jsfiddle.net/Ekx7Z/2/

Answer 7

尝试一些像这样的jquery：

$("#someId").click(function(){
    $("div.someClass").addclass("group");
});

将类添加到单击时具有特定类的所有元素

7 个答案: