切換給定的css類的所有元素

我想用一個複選框同時切換具有給定css類的多個元素。這看起來是這樣的：切換給定的css類的所有元素

HTML：

<input type="checkbox" onclick="toggle_class('.subdivision_wraps');" />

JS：

function toggle_class(cssClass) { 
    $$(cssClass).each(function(s){ 
    new Effect.toggle(s, 'blind', { duration: 0.3 }); 
    }); 
}

應該工作，對不對？錯誤..只有第一個div被切換。奇怪的是，如果我使用BlindDown，一切都會按照我想要的方式工作（所有div同時被遮蔽）。

我做錯了什麼？我知道我可以使用BlindDown和BlindUp，但我寧願解決這個切換問題。提前致謝！

來源

2013-01-09 elveti

這似乎是Effect.toggle一些奇怪的問題。如果你給div元素id值，你的代碼工作：http://jsbin.com/ifeqek/1如果你不這樣做，你得到你所看到的效果：http://jsbin.com/ifeqek/3

所以我可能會更新toggle_class到：

function toggle_class(cssClass) { 
    $$(cssClass).each(function(s){ 
    s.identify(); // <======== The new bit, assign an id if there isn't already one 
    new Effect.toggle(s, 'blind', { duration: 0.3 }); 
    }); 
}

Live Example | Source

來源

2013-01-09 10:33:05

似乎它需要等待以前的效果完成，然後才能運行下一個：http://jsfiddle.net/jamesallardice/Cpr82/ –

@JamesAllardice：這似乎也行得通，但它並不需要如果他們有'身份證'值（我完全*偶然發現），則延遲。很奇怪。 –

這是關於應用於沒有'id'的元素的效果被添加到名爲「global」的隊列的事實。當有一個'id'時，它被添加到一個以'id'作爲名字的隊列中（並且單獨的隊列可以同時運行）。但是這並不能解釋爲什麼需要延遲......這就是將它們添加到隊列中的一點！ –

切換給定的css類的所有元素

回答

相關問題