箱のプログラミング日記。

渋谷の自社開発企業でRails書いてます。

jQueryでの変数の使い方

セレクタ内で変数を使う

$('#label-box--${i}').css('width', '400px');

普通はこう書くけど、

$(`#label-box--${i}`).css('width', '400px');

このように書くこともできる。

 

つまり、テンプレートリテラル${}を使いたい時は

セレクタを文字列として「``で囲んでもOK

反対に「''」で囲んでもエラーになるので注意

 

for文の中のイベント内で変数を使う

for (val i=0; i<10; i++) {
 $(document).on("change", `.class${i}`, function() {
}

こう書くことが多いと思うけど、

 

for (let i=0; i<10; i++) {
 $(document).on("change", `.class${i}`, function() {
}

このように変数をvarではなくletで定義する。

 
varで変数定義をしてしまうと、onが呼ばれた瞬間にfor文の中の最後まで参照し
iに1が足されてしまった状態でイベント内で使われるため。
 
 
.
.
.