Note: この記事は、3年以上前に書かれています。Webの進化は速い！情報の正確性は自己責任で判断してください。

HTMLのForm要素、checkboxの入力チェックをするJavascript。実は意外な落とし穴があったりするのですが、↓のサンプルは対応済み。

• sample_1
• sample_2
• sample_3

Script

1. function chNull(msg,obj) {
2. if(!obj) return true;
3.  
4. if((obj.type || obj[0].type) == 'checkbox'){
5. var flag = 0;
6.  
7. if(obj.length){
8. for(var i=0; i<obj.length; i++) { if(obj[i].checked) flag = 1; }
9. } else {
10. if(obj.checked) flag = 1;
11. }
12.  
13. if(flag == 0) {
14. alert(msg + 'を選択してください。');
15. return false;
16. }
17. }
18. return true;
19. }

解説

チェックボックス上から1つずつ確認していって、1つでもチェックされていたら「flag = 1」にする。で、flagが0のままならalert出すと。

7～11行目は、次のように書くこともできる。

7. for(var i=0; i<obj.length; i++) if(obj[i].checked) flag = 1;

何故こうしなかったかというと、checkboxが1つだけの場合にうまく動かないから。これはJSの妙な挙動で、「配列の要素が1つだけ」の場合は、配列として扱われない。つまり変数扱いになるわけね。

7. if(obj.length){
8. for(var i=0; i<obj.length; i++) { if(obj[i].checked) flag = 1; }
9. } else {
10. if(obj.checked) flag = 1;
11. }

で、上のようになったと。この記述が意味を持ってくるのはブログの管理画面なんかで、記事一覧からまとめて削除する時とか。動的に生成されてる要素では、チェックできる記事やコメントが1つだけってのは十分ありうる話。

追記（2006.10.11）

Nein!さんからレビュー貰いました。

これは引数で渡すからであって、最初から配列を返すメソッドを使えば問題はない。 – Nein!, Javascript - 入力チェック

一連のレビューの完成版によると、つまり7～11行目は、次のように書くことができる。

7. var list=document.getElementsByName(objName);
8. for(var i=0;i<list.length;i++){
9. if(list[i].checked){
10. flg = 1;
11. }
12. }

うん、完璧！ 後は対応ブラウザとご相談。