jqueryで同じものを30個作って・・・

質問

jqueryでカレンダーを作っています。
$(".a").click(function(){
$(".b").toggle();
});

.aを押したら.bが開閉し、内容詳細が見れるようにしています。
ページ内には同じclassが30個あるので以下のように個別にナンバー01～30まで割り振っています。

for(i=0;i<30;i++){
if (i < 10) { i = "0" + i; }

$(".a-"+i).click(function(){
$(".b-"+i).toggle();
});
}
↑これだと、なぜか.a-01～.a-30のどれを押しても30個目の.b-30だけが開閉するようになってしまいました。
それぞれ(.a-01を押せば.b-01)が開閉するようにする方法を教えてください。

よろしくお願いします。

回答No.2

noname#78238 · ベストアンサー

class aとclass bの数が同じなら、eachを使い下記のようにしてはいかがでしょうか。

$(".a").each(function(i) {
$(this).click(function() {
$($(".b").get(i)).toggle();
});
});

回答No.1

yambejp

追加するメソッドの中では、上位の変数は継承されません。
この場合ですと変数iがfunction(){}の中にわたっていません。

やり方としては、iを予めわたしてやるか、this.idを参照して、
iにあたる番号をつきとめるかのどちらかが現実的でしょう。