• 締切済み

チェックボックスを画像アイコンでOffに。

ある操作をするために、チェックボックスのOn/Offで動作を分岐させています(そのやり方はできています)。本題ですが、普通に開くと、そのチェックボックスはOn状態になっています。それを、画像アイコン(無論、Form内に置くことはOK)をクリックすることで、Offにしたいと思っています。 しかし、どのようにしたらよいか、やり方がわからず、行き詰っています。 ご教授のほど、よろしくお願いします。

みんなの回答

  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.1

<img src="icon.jpg" onclick="javascript:document.getElementById('CB').checked=!document.getElementById('CB').checked"> 画像アイコンと連動:<input id="CB" type="checkbox" name="CB" value="CB"> というような感じでいいです。 画像をクリックする度に切り替わりますが、 質問文にあるように常にoffにする場合は、=以降を =false にして下さい。

関連するQ&A

  • 画像でチェックボックスを表示し、チェックの有無で画像を変える方法

    例えば、offという画像があり、その画像をクリックするとoff画像がon画像に変わり、もう一度クリックするとon画像になるというのを、チェックボックスで実現したいのですが、どなたかご教授願います。 よろしくお願いします。

  • チェックボックスのOnとOffを2つの画像にするには

    チェックボックスのOnとOffを2つの画像にして、POSTで通常通り 値を取得できる方法を教えてください。

  • JavaScriptとチェックボックスで画像の切替

    今月に入りJavaScriptの勉強を始めましたところ、 チェックボックスを使った画像の切り替えができなくて困っています。 具体的にはチェックボックスをチェックしたら画像を切り替えさせたいだけなのですが 対象画像一つに対してチェックボックスで切り替えることはできました。 しかし複数の画像にIDを割り当てて各々に対応するチェックボックスを クリックすると画像を切り替えることができません。 勿論各々の画像毎に関数を追加していけば切り替えはできるのですが 一つの関数ですっきり収めたいのです。 作成したコードは以下に記しておきます。 どうかよろしくお願いいたします。 <script type="text/javascript"> function sample(imageID,checkbox) { if (checkbox.checked) { document.getElementById(imageID).src = "on.png"; } else { document.getElementById(imageID).src = "on.png"; } } </script> <img src="off.png" id="test1" alt="" /> <img src="off.png" id="test2" alt="" /> <form> <input type="checkbox" onClick ="sample(test1','this')" /> <input type="checkbox" onClick ="sample(test2','this')" /> </form>

  • PHPでチェックボックスの結果を離れた配列に入れる

    PHPにて、複数あるチェックボックスの操作結果(オン/オフ)を変数に格納する方法を探しています。 予定として プログラム実行 → ボタンが1つと、チェックボックスが複数表示される → チェックボックス操作 → ボタンを押す → 複数のオン/オフ状況が配列に格納される といったものを作りたいと考えています。 現在はそのためのテストとして、ボタンを押した際のオン/オフの状況が画面に順に表示されるものを作っていますが、変数がUndefined Indexであると言われ、表示することができません。 現在のプログラムは下の通りです。 実際のプログラム上では、(1),(2),(3)はそれぞれソース内のかなり離れた場所にあります。 各チェックボックス(各<form>~</form>)毎にボタンを用意していないのが原因であるとは思うのですが、ボタンは特定の箇所に1つだけ用意したいと考えています。 またチェックボックス表示部とボタン表示部は(ソース的に)離れているため、 ボタン表示部で<form>を開いて、開いたまま進み、チェックボックス表示部が終わってやっと閉じる、という方法は難しいと思います。 どうすればチェックボックスの結果を離れた箇所にある配列に入れることができるのでしょうか。 宜しくお願いします。 [regist.php] <?php //(1) 更新ボタンを押すとチェックボックスのon/off結果が表示される if(isset($_POST['cmd_Print'])){ $check = $_POST["cb"]; for($i=0; $i<count($check); $i++){ print "${check[$i]}<br>"; } } //(2) 更新ボタンの表示 print("<form method=\"post\" action=\"regist.php\">"); print("<input type=\"submit\" name=\"cmd_Print\" value=\"結果表示\">"); print("</form>"); //(3) チェックボックス(on,off)を交互に表示 for($i=0; $i<5; $i++){ //チェックボックスをオンの状態で表示 print("<form method=\"POST\" action=\"./regist.php\">"); print sprintf('<input type="hidden" name="cb[]" value="off">'); print sprintf('<input type="checkbox" name="cb[]" value="on" checked="checked">'); print("</form>"); //↑チェックボックス操作後、オフの状態なら$cb[]に"off"を、オンの状態なら$cb[]に"on"を入れる //チェックボックスをオフの状態で表示 print("<form method=\"POST\" action=\"./regist.php\">"); print sprintf('<input type="hidden" name="cb[]" value="off">'); print sprintf('<input type="checkbox" name="cb[]" value="on">'); print("</form>"); //↑チェックボックス操作後、オフの状態なら$cb[]に"off"を、オンの状態なら$cb[]に"on"を入れる } ?>

    • 締切済み
    • PHP
  • チェックボックスのON/OFF

    こんにちは。 以下のようなテーブルがありまして <tr> <td>チェックボックス</td> <td>ID</td> <td>名前</td> </tr> このテーブルのTRのどこかをクリックするとチェックボックスを ON/OFFする方法のヒントを頂けないかと思って質問に参りました イメージとしては<label for="">の機能をTRに付けたいのです 作表とチェックボックスの環境としましては データベースから取り出したデータをforで回してテーブルに配置 チェックボックスのタグは各行に1つでこれのON/OFFがしたい チェックボックスのデータは配列で送りたいので○○[]名称 となっております (この辺りにはPHPを使用しています) セルクリックで背景色を変更するサンプルと、チェック全選択/全解除の サンプルはあるのですが、組み合わせや加工の仕方がわからず 調べてみてもチェックボックスをクリックしたら…というサンプルばかりで 私が求めている方法は残念ながら見つけられませんでした こんな質問だと丸投げになってしまうので、ヒントや処理の流れだけでも 教えて頂けると助かります ヨロシクお願いします

  • onとoffを画像でチェンジ、チェックボックスと連動させる

    下記は画像をクリックした際に、onとoffに変更し、かつチェックボックスのvalueの値を変更しておりますが、 例えば、A、B、C、D4個のボタンを準備し、それぞれにonとoffの画像を準備し割り当て、それぞれが、単独で、onとoffができるようにしたいのですが、どなたかご教授願います。 これは、1個のボタンを2枚の画像でオンとオフを切り替えていますが、4個のボタンでそれぞれのボタンのオンとオフの画像を準備して、それぞれのボタンのvalue値を変えたいというのがやりたい内容です。 <script type="text/javascript"> function sample(Img,name){ var onImg = 'on.gif'; var offImg = 'off.gif'; var Input = document.getElementsByName(name)[0]; if(Input.value){ Input.value = ''; Img.src = offImg; }else{ Input.value = 'on'; Img.src = onImg; } } </script> <img src="off.gif" alt="" width="" height="" onclick="sample(this,'CBOX1')"> <input type="hidden" name="CBOX1">

  • チェックボックスで画像を一括表示

    下記サイトを参照して、 「チェックボックスのON / OFFで画像を表示する」 「全てのチェックボックスのON / OFFを切り替える」 を組み合わせて、 「全てのチェックボックスのON / OFFを切り替えて画像の一括表示」をしたいのですが、全てのチェックボックスのON / OFFの切り替えはできるのですが、それに伴って画像の表示・非表示までは反応しませんでした。各チェックボックスのON / OFFでの画像の表示・非表示は可能です。 http://iswebmag.hp.infoseek.co.jp/sample163.html http://iswebmag.hp.infoseek.co.jp/sample164.html ▼htmlソースです。 <FORM name="f1"> <INPUT type=checkbox name="f1" onClick="show(0,'img01')">朝焼に輝く星<BR> <INPUT type=checkbox name="f1" onClick="show(1,'img02')">木立の隙間から<BR> <INPUT type=checkbox name="f1" onClick="show(2,'img03')">夜明け<BR> <INPUT type=checkbox name="f1" onClick="show(3,'img04')">自転を感じる<BR> <INPUT type=checkbox name="f1" onClick="show(4,'img05')">昼の星空<BR> <INPUT type=checkbox name="f1" onClick="show(5,'img06')">砂丘の月<BR> <INPUT type=checkbox name="f1" onClick="show(6,'img07')">月の軌跡<BR> <INPUT type=checkbox name="f1" onClick="show(7,'img08')">彗星の飛来<BR> <INPUT type=checkbox name="f1" onClick="show(8,'img09')">彗星 <BR> <INPUT type=button value="全てOn" onClick="all_on(this.form.f1)"> <INPUT type=button value="全てOff" onClick="all_off(this.form.f1)"> </FORM> ▼チェックボックスのON / OFFで画像を表示するJavaScript <SCRIPT language="JavaScript"> <!-- function show(c,img){ if(document.f1.elements[c].checked == true){ document.getElementById(img).style.width=200; } else { document.getElementById(img).style.width=0; } } // --> </SCRIPT> ▼全てのチェックボックスのON / OFFを切り替えるJavaScript <SCRIPT language="JavaScript"> <!-- function all_on(chk){ for (i = 0; i < chk.length; i++) { chk[i].checked = true; } } function all_off(chk){ for (i = 0; i < chk.length; i++) { chk[i].checked = false; } } // --> </SCRIPT>

  • ワードのチェックボックス

    ワードのチェックボックスをショートカットキーで操作したいのですがONにする(K)OFFにする(D)が操作できるときと出来ないときがあります。出来るようにしたいのですが‥‥ 宜しくお願いします。

  • エクセルのチェックボックスについて

    エクセルでアンケートのようなチェック項目がある物を作っているのですが、フォームのチェックボックスは「オン」「オフ」しかないので、次のようなことが出来なくて困っています。 例) □ 今日の天気は晴れです。 □ 今日の天気は雨です。 □ 今は午前です。 □ 2月は英語でFebruaryです。 □ 1+1=2です。    ・    ・    ・ 以上のようにチェック項目があり、該当するところにチェックをつけ、チェックされた数を出します。 また、項目が必要のない時は、例えば二重線(エクセルでは取消線は一本ですが)で消して、消した項目以外の数をだす、というような物です。 この二重線で消すという操作を、チェックボックス上でクリックするだけで、「オン」→「オフ」→「どちらでもない(?)」というようなことは出来るのでしょうか。 チェックボックスのコントロールの書式設定のコントロールタブの中に、「淡色表示」というのがあるのですが、これを「オン」「オフ」と同じようにワンクリックのみで出来たらと思い、質問させていただきました。 分かりにくい質問で大変申し訳ありませんが、どうかお知恵をおかしください。 また、発送の転換で「こんな方法はどう?」などというのがありましたら、お願いいたします。

  • チェックボックスのon/offで

    VB2008EEです。 チェックボックスにチェックを入れると指定したボタン上のテキストが「aaa」、 オフにすると「bbb」と切り替わるように出来るでしょうか? チェックボックスをオフにすると指定したラジオボタンがグレーアウトして 押せないようにして、オンにするとグレーアウトが解除されて選択できるように出来るでしょうか?

専門家に質問してみよう