loopの中のfunction

kintone カスタマイズ
1

ボタンをJavaScriptで作成し、処理をクリック時のfunctionで書いています。そのボタンをfor文で複数作ろうとすると、構文エラーで以下のようなメッセージが出力されます。

Don’t make functions within a loop.

書き方の作法はありますか。

 

for (var i=0;i<5;i++) {

``// 任意のスペースフィールドにボタンを設置

``var mySpaceFieldButton = document.createElement(``'button'``);

``mySpaceFieldButton.id = ``'my_space_field_button' + i``;

``mySpaceFieldButton.innerHTML = ``'スペースボタン'``;

``mySpaceFieldButton.onclick = ``function () {

``window.alert(``'スペースフィールド'``);

``}

kintone.app.record.getSpaceElement(``'my_space_field' + i``).appendChild(mySpaceFieldButton);

}

2

Toshimichi Konnoさん

mySpaceFieldButton.onclick = function () {
window.alert('スペースフィールド');
}

の部分を

mySpaceFieldButton.addEventListenner("click", function () {
window.alert('スペースフィールド');
});

に変更して実行すれば解決するかと思います。

3 
addEventListennerの方法に書き換えてみましたが、やはり同じメッセージが出ます。
4

Toshimichi Konnoさん

それであれば、ループ内で定義している関数をループ外に出してしまえばよいかと思います。

それぞれの関数ごとに処理を変えるのであればクロージャー関数(関数をreturnする関数)をループ外に定義すれば良いと思います。

5

自己解決したので報告します。

メッセージに関してはワーニングなので、出てても実行自体は出来ました。

やりたかったことは複数のボタンを配置してどのボタンを押したか認識したかったのですが、以下の方法で簡単に実現できました。

まず各ボタンに格納したい値をvalueプロパティに設定します。

mySpaceFieldButton.value = 9999;

取り出す方法としてはjqueryの記法で以下のようにやりました。

window.alert($(this).val());