dポイントプレゼントキャンペーン実施中！

ドロップダウンメニューで選択された内容通りにチェックを入れるJS

解決済

  • 質問者：litton101
  • 質問日時：
  • 回答数：12件

ドロップダウンメニューで選択された内容通りにチェックを入れるJS
をご教示下さい。
なお、本番環境で対象とするチェックボックスのnameは、全てchkで始まっている法則性があります。

よろしくお願い致します。

<html>
<head>
<script type="text/javascript">
<!--
// -->
</script>
</head>
<body>
<form>
<select name="myselect">
<option selected>全てにチェック</option>
<option>全てチェック解除</option>
<option>奇数だけチェック</option>
<option>偶数だけチェック</option>
<option>1、6、8番だけチェック</option>
<option>3番以降全てチェック</option>
</select>
<br>
<input type="checkbox" value="1" name="chk01" checked>1番<br>
<input type="checkbox" value="1" name="chk02" checked>2番<br>
<input type="checkbox" value="1" name="chk03" checked>3番<br>
<input type="checkbox" value="1" name="chk04" checked>4番<br>
<input type="checkbox" value="1" name="chk05" checked>5番<br>
<input type="checkbox" value="1" name="chk06" checked>6番<br>
<input type="checkbox" value="1" name="chk07" checked>7番<br>
<input type="checkbox" value="1" name="chk08" checked>8番<br>
<input type="checkbox" value="1" name="chk09" checked>9番<br>
<input type="checkbox" value="1" name="chk10" checked>10番
</form>
</body>
</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (12件中11～12件)

No.3

  • 回答者： zeff#1
  • 回答日時：

zeffです。

続き。

<body>
<form name="form1" action="#">
<p>
<select name="myselect" onchange="sample(this)">
<option selected>全てにチェック</option>
<option>全てチェック解除</option>
<option>奇数だけチェック</option>
<option>偶数だけチェック</option>
<option>1、6、8番だけチェック</option>
<option>3番以降全てチェック</option>
</select>
</p>
<p><input type="checkbox" value="1" name="chk01" checked>1番</p>
<p><input type="checkbox" value="1" name="chk02" checked>2番</p>
<p><input type="checkbox" value="1" name="chk03" checked>3番</p>
<p><input type="checkbox" value="1" name="chk04" checked>4番</p>
<p><input type="checkbox" value="1" name="chk05" checked>5番</p>
<p><input type="checkbox" value="1" name="chk06" checked>6番</p>
<p><input type="checkbox" value="1" name="chk07" checked>7番</p>
<p><input type="checkbox" value="1" name="chk08" checked>8番</p>
<p><input type="checkbox" value="1" name="chk09" checked>9番</p>
<p><input type="checkbox" value="1" name="chk10" checked>10番</p>
</form>
</body>
</html>
    • good
    • 0
    • 件
通報する

No.1

  • 回答者： babu_baboo
  • 回答日時：

ぜんかくくうはくは、はんかくにしてください。


もうすこしまつと、もっとみじかくするひとが、かきこみます！

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<title></title>
<body>
<form action="#">
　<p>
　　<select name="myselect" onchange="fuga.call( this, event )">
　　　<option value="1111111111" selected>全てにチェック</option>
　　　<option value="0000000000">全てチェック解除</option>
　　　<option value="1010101010">奇数だけチェック</option>
　　　<option value="0101010101">偶数だけチェック</option>
　　　<option value="1000010100">1、6、8番だけチェック</option>
　　　<option value="0001111111">3番以降全てチェック</option>
　　</select>
　</p>
　<p><input type="checkbox" value="1" name="chk" checked>1番</p>
　<p><input type="checkbox" value="1" name="chk" checked>2番</p>
　<p><input type="checkbox" value="1" name="chk" checked>3番</p>
　<p><input type="checkbox" value="1" name="chk" checked>4番</p>
　<p><input type="checkbox" value="1" name="chk" checked>5番</p>
　<p><input type="checkbox" value="1" name="chk" checked>6番</p>
　<p><input type="checkbox" value="1" name="chk" checked>7番</p>
　<p><input type="checkbox" value="1" name="chk" checked>8番</p>
　<p><input type="checkbox" value="1" name="chk" checked>9番</p>
　<p><input type="checkbox" value="1" name="chk" checked>10番</p>
</form>

<script type="text/javascript">

var hoge = function ( es /*Array Elements*/ ) {
　return function ( ) {
　　var vs = this.value.split( '' ), i = vs.length;
　　while( i-- ) es[ i ].checked = !!+vs[ i ];
　};
};

var fuga = hoge( document.getElementsByName( 'chk' ) );

</script>
    • good
    • 0
    • 件
通報する
この回答へのお礼

babu_babooさん、ご回答ありがとうございました。

せっかく皆様にご提示いただいたご回答ですから、すべてを試してから
どれを本番環境に組み込もうと思っていたのですが、
実際の作業が本日になってしまったため、お礼が遅くなりましたことを
まずはお詫び申し上げます。

さて、babu_babooさんのご提示のものが、JSがよくわかっていない私に
とっては一番理解しやすかったです。

要するにチェックON/OFFを、VALUEのゼロ／イチで判断するわけですね。

本件に限らず、別のケースでも活用させていただけそうです。

ご回答、ありがとうございます。

通報する
お礼日時：2010/06/01 22:38

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報