JQueryでループ処理をする時のあれこれメモ
基本的には、以下の形式。
$.each(リスト,function(インデックス,データ){処理});
配列のループ
var list = [ 1, 2, 3, 4 ];
$.each(list,function(index,data) {
console.log(index + ":" + data);
});
<結果>
0:1
1:2
2:3
3:4
連想配列のループ
var list = {key:1,data:"a",name:"test"}
$.each(list,function(key,data) {
console.log(key + ":" + data);
});
<結果>
key:1
data:a
name:test
$.eachでbreak(中断)とcontinue(スキップ)
$.eachのループでは、breakやcontinueというメソッドは用意されていません。
代わりにbreakはreturn falseと記載し、continueはreturn trueと記載します。
var list = [{key:1,data:"a",name:"test1"},
{key:2,data:"b",name:"test2"},
{key:3,data:"c",name:"test3"},
{key:4,data:"d",name:"test4"}];
$.each(list,function(index,data) {
if ( data.key < 3 ) return true;
if ( data.key > 3 ) return false;
console.log(index+":"+data.name);
});
<結果>
オブジェクトもループできる
console.log(index+":"+$(object).text());
});
<結果>
1:Hello
2:Bye
3:See you
オブジェクトのループは以下のように書いてもよい。
オブジェクト.each(function(インデックス,データ){処理});
console.log(index+":"+$(object).text());
});