• ベストアンサー

checkboxについて

下のように初期状態でcheckboxにチェックされているのを buttonのresetをおすとjavascriptでチェック解除するということはできますか？ <INPUT TYPE="checkbox" name="check_no1" checked>

  • mune
  • お礼率13% (21/151)

質問者が選んだベストアンサー

  • ベストアンサー
noname#9414
noname#9414
回答No.1

このような手段ではどうでしょうか？ １．ディフォルトのINPUTタグでは、checkedを使わずに、 JavaScriptで後からチェックした状態にする。 ２．そうするとResetボタンは、チェックしていない状態が、 初期状態だと思っているので、ボタンを押すと、チェックを はずしてくれます。 一応下にソースをつけてはおきますが、とりあえず、パッと 作ったものなので、すべてのブラウザで動作するかどうかは 分かりません。きちんと解析して、作り直してください。 >>ここからがソースです。 <FORM name="f"> <INPUT type="Checkbox" name="c">これこれ <INPUT type="Reset" value="Reset"> </FORM> <SCRIPT language="JavaScript"> document.f.c.click(); </SCRIPT> >>ここまでがソースです。 上記のソースは、とりあえずまともに動作（IE5.0にて）しましたので、 おそらく、IEであれば、きちんと動くと思います。 しかしNNでは分からないので、ご自分で確認お願いします。 ではでは☆

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • checkboxを全てcheckを画像ボタンで

    一つのフォームの中に、複数のcheckboxのグループがあって そのグループ毎に、全てチェック、解除ボタンをつけているのですが それを画像のボタンで実現したいのですが、どのようにしたらいいでしょうか？ *通常のボタンでは動作していますが、画像をボタンにした時に動作しません。 チェックを入れて、その場面にとどまって欲しいのに 画像で作るとチェックを入れて、検索してしまいます。 以下、現在と、画像ボタンのうまく動かないものも書いています。 よろしくお願いいたします。 <SCRIPT language="JavaScript"> <!-- // チェックボックスに使用している名前 chn1 = new Array("bukken_ID[1]","bukken_ID[2]"); // 全てのチェックボックをチェックする function chBxOn1(){ for(i=0; i<chn1.length; i++) { document.nForm.elements[chn1[i]].checked = true; } } // 全てのチェックボックのチェックを外す function chBxOff1(){ for(i=0; i<chn1.length; i++) { document.nForm.elements[chn1[i]].checked = false; } } //--> </SCRIPT> <SCRIPT language="JavaScript"> <!-- // チェックボックスに使用している名前 chn = new Array("ku_area[1]","ku_area[2]"); // 全てのチェックボックをチェックする function chBxOn2(){ for(i=0; i<chn2.length; i++) { document.nForm.elements[chn2[i]].checked = true; } } // 全てのチェックボックのチェックを外す function chBxOff2(){ for(i=0; i<chn2.length; i++) { document.nForm.elements[chn2[i]].checked = false; } } //--> </SCRIPT> <form id="form2" name="nForm" method="post" action="#"> <input type="checkbox" name="bukken_ID[1]" id="bukken_ID" value="1" /> マンション <input type="checkbox" name="bukken_ID[2]" id="bukken_ID" value="2" /> 一戸建て <input type="button" value="全てチェックを入れる" onclick="chBxOn1()" /> <input type="button" value="チェック解除" onclick="chBxOff1()" /> <input type="checkbox" name="ku_area[1]" id="ku_area" value="1"/>住所１ <input type="checkbox" name="ku_area[2]" id="ku_area" value="2"/>住所２ <input type="button" value="全てチェックを入れる" onclick="chBxOn2()" /> <input type="button" value="チェック解除" onclick="chBxOff2()" /> <input type="submit" name="button3" id="button3" value="以上の条件で検索" /> </form> 以下、うまく動かない画像のボタンです。 <input type="image" src="img/allcheck1.gif" alt="全てチェックを入れる" onClick="chBxOn1()"> <input type="image" src="img/riset.gif" alt="チェック解除" onClick="chBxOff1()">

  • 大量のcheckboxにcheckedを入れる

    チェックボックスが50個あります。 送信ボタンを押して元のページを再度開きます。 そのときにチェックしたボックスにチェックを入れた状態にしたいです。 inputタグの中に<?php if(isset($checkbox2) && in_array('b2',$checkbox2)){echo ' checked';} ?>を入れていますが単調になってしまいます。 単調にならずにする方法はありますか？ <input type="checkbox" name="chk1[]" value="a1" />の場合はインデックスが固定でないのでできませんでした。 その他いけない箇所があれば教えて下さい。 お願いします。 <?php if(isset($_GET["chk1"])){ $checkbox1 = $_GET["chk1"]; for($i=0; $i<sizeof($checkbox1); $i++){ print $checkbox1[$i]."<br />"; } } if(isset($_GET["chk2"])){ $checkbox2 = $_GET["chk2"]; foreach($checkbox2 as $key => $val){ print $val."<br />"; } } ?> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <body> <form method="get" action="checkbox.php"> <input type="checkbox" name="chk1[]" value="a1" /> <input type="checkbox" name="chk1[]" value="a2" /> <input type="checkbox" name="chk1[]" value="a3" /> <input type="checkbox" name="chk1[]" value="a4" /> <input type="checkbox" name="chk1[]" value="a5" /> <input type="checkbox" name="chk1[]" value="a6" /> <input type="checkbox" name="chk1[]" value="a7" /> <input type="checkbox" name="chk1[]" value="a8" /> <input type="checkbox" name="chk1[]" value="a9" /> <input type="checkbox" name="chk1[]" value="a10" /> <br /> <input type="checkbox" name="chk2['b1']" value="b1" <?php if(isset($checkbox2) && in_array('b1',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b2']" value="b2" <?php if(isset($checkbox2) && in_array('b2',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b3']" value="b3" <?php if(isset($checkbox2) && in_array('b3',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b4']" value="b4" <?php if(isset($checkbox2) && in_array('b4',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b5']" value="b5" <?php if(isset($checkbox2) && in_array('b5',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b6']" value="b6" <?php if(isset($checkbox2) && in_array('b6',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b7']" value="b7" <?php if(isset($checkbox2) && in_array('b7',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b8']" value="b8" <?php if(isset($checkbox2) && in_array('b8',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b9']" value="b9" <?php if(isset($checkbox2) && in_array('b9',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b10']" value="b10" <?php if(isset($checkbox2) && in_array('b10',$checkbox2)){echo ' checked';} ?>/> <br /> <input type="submit" value="送信" /> </form> </body> </html>

    • 締切済み
    • PHP
  • javascript checkbox

    完全に初心者です。。 下記のスクリプトをもとに、 ■チェックAをチェックしたら全てチェックされる ■またチェックAをチェックしたら全て外れる ようにしたいです。。 でも何がダメか分かりません。。 一部を書くのではなく出来ればスクリプト全ていただけたらと思います。 あともし宜しければチェックAをチェックしたら、１～６をチェックできないようにもしたいです。。 ご教授よろしくお願いします。。 <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <TITLE></TITLE> <SCRIPT language="JavaScript"> function check(){ for(i=1; i<7; i++){ document.form1.elements[ch[i]].checked = true; } } </SCRIPT> </HEAD> <BODY> 全てのチェックボックスをチェック/解除 <FORM name="form1"> <p><INPUT type="checkbox" id="ch" onclick="check()">チェックＡ</p> 　　<INPUT type="checkbox" id="ch1">チェック１ 　　<INPUT type="checkbox" id="ch2">チェック２ 　　<INPUT type="checkbox" id="ch3">チェック３<BR><BR> 　　<INPUT type="checkbox" id="ch4">チェック４ 　　<INPUT type="checkbox" id="ch5">チェック５ 　　<INPUT type="checkbox" id="ch6">チェック６<BR><BR> 　　<BR> </FORM> </BODY> </HTML>

  • []を付けずにcheckboxの値を複数受信

    カテゴリをPHPとするか迷いましたが、 こちらに質問させていただきます。 <input type="checkbox" name="hiragana[]" value="a">あ <input type="checkbox" name="hiragana[]" value="i">い <input type="checkbox" name="hiragana[]" value="u">う とした場合、 $checked=$_POST['hiragana']; print_r($checked); などとして使えることはわかるのですが、 角括弧をつけず、 <input type="checkbox" name="hiragana" value="a">あ <input type="checkbox" name="hiragana" value="i">い <input type="checkbox" name="hiragana" value="u">う としたときに、同様に配列として取得する(すべてのチェックされた項目を取得する) 方法はあるのでしょうか？ このようにした場合、 $checked=$_POST['hiragana']; print_r($checked); や print_r($_POST); すると、最後にチェックされた値しか入っていないようです。 (上書きされているようですが...) HTTPヘッダを見ると、 hiragana=a&hiragana=i&hiragana=u のように、すべて送信はされているのは確認できるのですが... 後者のような角括弧をつけていないタイプのcheckboxを使って ちゃんとチェックされた値をすべて受信して動作していると 思われるサイトを目にするので どうすればできるのかと思い質問させて頂きました。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • checkbox ループ

    下記のスクリプトだと、 デバックが１６になってしまいます。 これをどうにかして、 ＡをチェックしたらＡ内だけをループ、 ＢをチェックしたらＢ内だけをループさせたいんですが、 どこをどのように修正すればいいですか？？ スクリプトをかなり変えるのは避けたいです。。 教えてください。。 <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <TITLE></TITLE> <SCRIPT language="JavaScript"> function check(n){ document.getElementById('debug').innerHTML = "デバッグ情報"; document.getElementById('debug').innerHTML = document.getElementById('debug').innerHTML + "<br>lengthは" + document.form1.length; for(i=1; i<=document.form1.length; i++){ if(document.form1.elements["ch" + n].checked){ document.form1.elements["ch" + n + "-" + i].checked = true; document.form1.elements["ch" + n + "-" + i].disabled = true; }else{ document.form1.elements["ch" + n + "-" + i].checked = false; document.form1.elements["ch" + n + "-" + i].disabled = false; } } } </SCRIPT> </HEAD> <BODY> 全てのチェックボックスをチェック/解除 <FORM name="form1"> <p><INPUT type="checkbox" id="ch1" onclick="check(1)">チェックＡ</p> <INPUT type="checkbox" id="ch1-1">チェック１ <INPUT type="checkbox" id="ch1-2">チェック２ <INPUT type="checkbox" id="ch1-3">チェック３<BR><BR> <INPUT type="checkbox" id="ch1-4">チェック４ <INPUT type="checkbox" id="ch1-5">チェック５ <INPUT type="checkbox" id="ch1-6">チェック６<BR><BR> <BR> <p><INPUT type="checkbox" id="ch2" onclick="check(2)">チェックＢ</p> <INPUT type="checkbox" id="ch2-1">チェック１ <INPUT type="checkbox" id="ch2-2">チェック２ <INPUT type="checkbox" id="ch2-3">チェック３ <INPUT type="checkbox" id="ch2-4">チェック４<BR><BR> <INPUT type="checkbox" id="ch2-5">チェック５ <INPUT type="checkbox" id="ch2-6">チェック６ <INPUT type="checkbox" id="ch2-7">チェック７ <INPUT type="checkbox" id="ch2-8">チェック８<BR><BR> <BR> </FORM> <p id="debug"></p> </BODY> </HTML>

  • checkbox 特定項目だけを、チェックするには

    こんにちは。いつもお世話になります。 checkbox内で、同じnameの中から特定のものだけ チェックさせるにはどうしたら良いでしょうか。 条件として、name='or52'の部分は変更出来ません。 <input type='button' value='A,B,Cだけを同時にチェック' onclick='checkAll();'> <form action='xxx.cgi' method='post' name='f1'> <input name='or5' type='checkbox' value='A'><br> <input name='or5' type='checkbox' value='B'><br> <input name='or5' type='checkbox' value='C'><br> <input name='or5' type='checkbox' value='D'><br> <input name='or5' type='checkbox' value='E'><br> <input name='or5' type='checkbox' value='F'><br> ......... </form> それで、こんなのをウェブから探してきました。 function checkAll() { for (i=0; i<7; i++) document.f1.elements["or52"+i].checked = true; } そして、同時にチェックしたいものだけ下記の様にしました。 <input name='or52' type='checkbox' value='A' id='or51'> <input name='or52' type='checkbox' value='B' id='or52'> <input name='or52' type='checkbox' value='C' id='or53'> 取りあえずできますが、エラーがでます。 「document.f1.elements["..."]は、objまたはnullではない！」 どうか教えて下さい。よろしくお願いします。

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

    ドロップダウンメニューで選択された内容通りにチェックを入れる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>

  • checkboxの選択数制限と排他処理について

    javascript初心者です。よろしくお願い致します。現在チェックボックスを使用したクイズサイトを作成しており、回答が５つの中から正しいものをチェックし送信するというものです。 その中で、正解数（今回は2つ）以上にチェックをした時に最初にチェックした方のチェックボックスのチェックが外れるという仕組みを組み込む事になりました。 選択数に制限をかけることや排他処理（ラジオボタン）は理解できるのですが、上記の実現方法がどうしても分からず質問させていただきました。 どうかよろしくお願い致します。 <html> <head> <script type="text/javascript"> function check(f,o,m){ var c = i = 0, b = f.elements; for (i; i < b.length; i++) if(b[i].type&&b[i].type=='checkbox'&&b[i].checked&&b[i].parentNode.id==o) c++; for (i = 0; i < b.length; i++) if(b[i].type&&b[i].type=='checkbox'&&!b[i].checked&&b[i].parentNode.id==o) b[i-2].checked=false;// これだと２つ前ではなく2番目のチェックボックスが排他になります。 } </script> </head> <body> <form action="#" id="sampleform" onclick="check(this,'options',2);"> <fieldset id="options"><input type="checkbox" name="" value=""><br> <input type="checkbox" name="" value=""><br> <input type="checkbox" name="" value=""><br> <input type="checkbox" name="" value=""><br> <input type="checkbox" name="" value=""><br> <input type="checkbox" name="" value=""><br> </fieldset> </form> </body> </html>

  • JavaScriptでcheckboxの入力個数制限

    以下のようなチェックボックスがあります。 ３つ以上チェックできないようにしたいのですが、JavaScriptで可能でしょうか？ <FORM method=POST action="aaa.cgi" name="FORM1"> <input type="checkbox" name="Q1" value="1">1<br> <input type="checkbox" name="Q2" value="1">2<br> <input type="checkbox" name="Q3" value="1">3<br> <input type="checkbox" name="Q4" value="1">4<br> <input type="checkbox" name="Q5" value="1">5<br> </form>

  • チェックボックスの初期選択と選択保持

    複数のチェックボックスのうちどれかを初期選択させ、ボタン押下後は選択保持をさせたいです。 片方のみならできるのですが、どなたかご教授いただけるとうれしいです。 現在のソースはこんな感じになっていて選択したものの保持はできるのですが、初期選択ができていません。よろしくおねがいします。 <html> <body> <form name="form" method="post"> <?php test1() ?> test1 <?php test2() ?> test2 <?php test3() ?> test3<br><br> <input type="submit" name="button" value="button"> </form> <?php function test1(){ if ($_POST['test1']){ echo "<input type=\"checkbox\" name=\"test1\" checked>"; }else{ echo "<input type=\"checkbox\" name=\"test1\">"; } } function test2(){ if ($_POST['test2']){ echo "<input type=\"checkbox\" name=\"test2\" checked>"; }else{ echo "<input type=\"checkbox\" name=\"test2\">"; } } function test3(){ if ($_POST['test3']){ echo "<input type=\"checkbox\" name=\"test3\" checked>"; }else{ echo "<input type=\"checkbox\" name=\"test3\">"; } } ?> </body> </html>

    • 締切済み
    • PHP

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する