このページの2つのバージョン間の差分を表示します。
次のリビジョン | 前のリビジョン | ||
プログラム言語:javascript_jquery:ループ [2018/10/11 11:01] yusuke_komori 作成 |
プログラム言語:javascript_jquery:ループ [2024/12/27 05:02] (現在) humolife [HTML要素でループ] |
||
---|---|---|---|
行 1: | 行 1: | ||
====== ループ ====== | ====== ループ ====== | ||
- | ===== jQueryでのループ ===== | + | ===== eachを使ったjQueryでのループ ===== |
+ | ==== HTML要素でループ ==== | ||
+ | each でのループ中に continue した場合は return true を、break したい場合は return false をする。 | ||
< | < | ||
<form action=" | <form action=" | ||
行 12: | 行 14: | ||
// 要素でループ | // 要素でループ | ||
$(' | $(' | ||
+ | if (条件) { | ||
+ | return true; // continue | ||
+ | } | ||
+ | if (条件) { | ||
+ | return false; | ||
+ | } | ||
console.log($(this).val()); | console.log($(this).val()); | ||
}); | }); | ||
行 18: | 行 26: | ||
$(' | $(' | ||
console.log($(this).data(' | console.log($(this).data(' | ||
+ | }); | ||
+ | }); | ||
+ | </ | ||
+ | </ | ||
+ | ==== オブジェクトでループ ==== | ||
+ | < | ||
+ | <div> | ||
+ | 学年 | ||
+ | <select name=" | ||
+ | <option value=" | ||
+ | <option value=" | ||
+ | <option value=" | ||
+ | </ | ||
+ | </ | ||
+ | <div> | ||
+ | クラス | ||
+ | <select name=" | ||
+ | <option value=""> | ||
+ | </ | ||
+ | </ | ||
+ | < | ||
+ | $(function(){ | ||
+ | const class_list = { | ||
+ | 1: | ||
+ | 2: | ||
+ | 3: | ||
+ | }; | ||
+ | |||
+ | $(' | ||
+ | let grade = $(this).val(); | ||
+ | $(' | ||
+ | $.each(class_list[grade], | ||
+ | $(' | ||
+ | }); | ||
}); | }); | ||
}); | }); |