※ ChatGPTを利用し、要約された質問です（原文：フォームのチェックボックスの入力チェック JavaScriptの添削依）
フォームのチェックボックスの入力チェック JavaScriptの添削依頼
このQ&Aのポイント
フォーム制作しています。複数選択可能なチェックボックスの入力チェックを行いたいのですが、動かず困っています。
JavaScriptの添削をお願いします。他のチェック項目との兼ね合いもあり、JavaScriptはform.jsに記載したいこと、チェックボックスが未選択の場合は、flagに1を入れること、チェックボックスの数が多いため、それぞれ違うnameを振る方法は避けたいこと、が制作の条件になっています。
フォームの入力で未入力のチェックを行います。チェックボックスが未選択の場合は警告ダイアログを表示し、送信を中止します。
フォームのチェックボックスの入力チェック JavaScriptの添削依
フォームのチェックボックスの入力チェック JavaScriptの添削依頼
フォーム制作しています。
複数選択可能なチェックボックスの入力チェックを行いたいのですが、
動かず困っています。
JavaScriptの添削をお願いします。
他のチェック項目との兼ね合いもあり、
JavaScriptはform.jsに記載したいこと、
チェックボックスが未選択の場合は、flag に 1 を入れること、
チェックボックスの数が多いため、それぞれ違う name を振る方法は避けたいこと、
が制作の条件になっています。
■index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無題ドキュメント</title>
</head>
<html>
<head>
<!-- *** javascript *** -->
<script src="form.js" type="text/javascript" charset="utf-8"></script>
</head>
<body bgcolor="#ffffff">
フォームの入力で未入力のチェックを行います。
<form method="post" onSubmit="return chkform()" name="form1">
<input type="checkbox" name="chk[]" value="OK">OK
<input type="checkbox" name="chk[]" value="NG">NG
<input type="checkbox" name="chk[]" value="GOOD">GOOD
<br>
<br>
<input type=submit value=" 送信 ">
<input type=reset value=" 取消 ">
</form>
</body>
</html>
■form.js
function chkform() {
var flag = 1;
var list=document.getElementsByName(chk);
for(var i=0;i<list.length;i++){
if(list[i].checked){
flag = 0; break;
}
}
if(flag == 1){
window.alert('チェックボックスが未選択です'); // 入力漏れがあれば警告ダイアログを表示
return false; // 送信を中止
}
else {
return true ;
}
}
お礼
ありがとうございます！ 指摘いただいた箇所を直したら動きました。 > # 文書全体を検索する理由ってなんだろ。 いろいろなところからコードをコピーして作っているので 記述の方法がバラバラなのです・・・。 ↑で言われたことも、何のことかよく理解していません。 もしよければ教えていただけませんでしょうか？ > XHTML でないものを XHTML として渡している理由が良く分からない。 こちらに投稿するために、仮で作ったhtmlですのでご容赦ください。 確かに、XHTMLの仕様に沿ってませんでしたね・・・。