如何用jquery更改多个div类？

我是一个总noob努力学习jquery和javascript努力学习。我认为我对这个代码有一个非常难的目标，需要帮助不好。我花了15个小时试图弄清楚，但仍然没有看到解决方案。如何用jquery更改多个div类？

这里是我的示例代码：

<div class="daddy"> 

    <div id="reset" onclick="changeAllFatsToSkinny">reset</div> 

    <div class="skinny baby" onclick="weightChange(event)">Button01</div> 
    <div class="fat baby" onclick="weightChange(event)">Button03</div> 

    <div id="random" class="no class here">random text</div> 

</div>

目标：点击事件“weightChange”从默认的“瘦宝宝”改变DIV类为“胖娃娃”。我有以下的代码工作...

function weightChange (event) { 
var element = event.currentTarget; 
element.className = (element.className == 'skinny baby') ? 'fat baby' : 'skinny baby'; 
}

此代码可能是矫枉过正，但它的工作现在。问题是，我不知道如何通过点击“重置”div来找到并替换div“爸爸”的所有孩子中的“胖宝宝”类回到“瘦宝宝”。我有点工作，但它改变了包括“随机”div在内的所有div的课程。

我已经看过了一堆的jQuery代码，并认为我需要串起来的

.find() 
.hasClass() 
.removeClass() 
.addClass() or maybe just toggleClass()

做这一切。我想我也需要某种“如果是”的说法。我的问题是，我不知道足够的Javascript来获得正确的语法。我吮吸，因为这个问题我非常难过。请，请帮助我！？提前非常感谢你。

P.S.我真的需要有人为我写出解决方案，因为我已经尝试过将多个演示示例拼凑在一起，而没有获得理想的结果。我甚至不知道如何制作点击事件。由于这个问题，我已经沦为婴儿。抱歉。

来源

2011-09-18 William Larsen

这里就是你正在寻找代码：

$('#reset').click(function(){ 
    $('.daddy .baby').removeClass('fat').addClass('skinny'); 
});

你们声称自己是使用jQuery，但是你是不是在你的代码使用它。

可以按如下方式重写代码：

$('.baby').click(function(){ 
    $(this).toggleClass('fat skinny'); 
});

绝对没有必要内嵌的JavaScript。

这里的小提琴：http://jsfiddle.net/MLHDh/

来源

2011-09-18 23:08:35

/同意，采取“使用Javascript好的部分”（真的是一本小册子），以及http://en.wikipedia.org/wiki/Unobtrusive_JavaScript的读取。以这种方式使用JavaScript只会导致痛苦，痛苦和恨一个良好的语言。 – Louis

我不能告诉你我多么感谢你的帮助！我正在消化你的榜样并将其分解。我知道这很简单，但我从来没有发布过问题板。谢谢你指出我的整个做法是不好的（约瑟夫和路易斯）。我需要知道，所以我现在可以停下来。谢谢！！ –

@Louis - “Javascript好的部分”将在他的头上方式。他显然需要更接近“Javascript for Dummies”一书。 – maxedison

如何用jquery更改多个div类？

回答

相关问题