javascriptでワンクリックで複数チェックのやり方を教えてください。



<input type="checkbox" name="b[0]" id="a1">
<input type="checkbox" name="b[1]" id="a1">
<input type="checkbox" name="b[2]" id="a2">
<input type="checkbox" name="b[3]" id="a2">

<a onclick="????">ID="a1"をチェック</a>
<a onclick="????">ID="a2"をチェック</a>
<a onclick="????">すべてチェック</a>

上記のHTMLコードを動かすにはどんなjavascriptを書けばいいんでしょうか?

調べても、分からなかったので参考サイトのURLは特に不要です。
サクッと回答をお願いいたします。

回答の条件
  • 1人2回まで
  • 登録:2007/03/31 19:11:46
  • 終了:2007/03/31 21:08:56

ベストアンサー

id:wnagata No.2

wnagata回答回数170ベストアンサー獲得回数182007/03/31 20:52:03

ポイント60pt

同じIDの要素が複数あるというのは、どうなのかと思いますが、

以下のHTMLで要件を満たすのではないでしょうか。

Aタグの属性には、"#"と定義しておき、

onClick属性の値として、

checkAll(new Array('b[0]','b[1]','b[2]','b[3]'));

を指定します。


< <html> <head> <script type="text/javascript"> <!-- function check(name) { document.myForm.elements(name).checked=true; } function checkAll(names) { for (var i = 0; i < names.length; i++) { check(names[i]); } } // --> </script> </head> <body> <form name="myForm"> <input type="checkbox" name="b[0]" id="a1"> <input type="checkbox" name="b[1]" id="a1"> <input type="checkbox" name="b[2]" id="a2"> <input type="checkbox" name="b[3]" id="a2"> </form> ID="a1"をチェック ID="a2"をチェック すべてチェック </body> </html> >

その他の回答(1件)

id:SALINGER No.1

SALINGER回答回数3454ベストアンサー獲得回数9692007/03/31 20:02:35

ポイント10pt

コード的には汚くなったんだけど、基本的にはチェックがついているかを確認してからclick()でチェックをつけること。(すでについていると逆に消えるから)

<html>
<head>
<script Language="JavaScript">
<!--
function cl(a){ 
	switch(a){
		case "1":
			if ( ! document.forms[0].elements["b[0]"].checked )  document.forms[0].elements["b[0]"].click();
			break;
		case "2":
			if ( ! document.forms[0].elements["b[1]"].checked )  document.forms[0].elements["b[1]"].click();
			break;
		case "3":
			if ( ! document.forms[0].elements["b[0]"].checked )  document.forms[0].elements["b[0]"].click();
			if ( ! document.forms[0].elements["b[1]"].checked )  document.forms[0].elements["b[1]"].click();
			if ( ! document.forms[0].elements["b[2]"].checked )  document.forms[0].elements["b[2]"].click();
			if ( ! document.forms[0].elements["b[3]"].checked )  document.forms[0].elements["b[3]"].click();
			break;
	}
}
// -->
</script>
</head>
<body>
<form>
<input type="checkbox" name="b[0]" id="a1">
<input type="checkbox" name="b[1]" id="a1">
<input type="checkbox" name="b[2]" id="a2">
<input type="checkbox" name="b[3]" id="a2"><br>
<a onclick="cl('1')">ID="a1"をチェック</a><br>
<a onclick="cl('2')">ID="a2"をチェック</a><br>
<a onclick="cl('3')">すべてチェック</a>
</form>
</body>
</html>
id:wnagata No.2

wnagata回答回数170ベストアンサー獲得回数182007/03/31 20:52:03ここでベストアンサー

ポイント60pt

同じIDの要素が複数あるというのは、どうなのかと思いますが、

以下のHTMLで要件を満たすのではないでしょうか。

Aタグの属性には、"#"と定義しておき、

onClick属性の値として、

checkAll(new Array('b[0]','b[1]','b[2]','b[3]'));

を指定します。


< <html> <head> <script type="text/javascript"> <!-- function check(name) { document.myForm.elements(name).checked=true; } function checkAll(names) { for (var i = 0; i < names.length; i++) { check(names[i]); } } // --> </script> </head> <body> <form name="myForm"> <input type="checkbox" name="b[0]" id="a1"> <input type="checkbox" name="b[1]" id="a1"> <input type="checkbox" name="b[2]" id="a2"> <input type="checkbox" name="b[3]" id="a2"> </form> ID="a1"をチェック ID="a2"をチェック すべてチェック </body> </html> >

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません