• 締切済み

checkboxの文字連結の方法を教えてください

<INPUT name="ch" type="checkbox" value="1">1 <INPUT name="ch" type="checkbox" value="2">2 <INPUT name="ch" type="checkbox" value="3">3 <INPUT name="ch" type="checkbox" value="4">4 <INPUT name="ch" type="checkbox" value="5">5 選択してボタンを押すとチェックされた文字だけをカンマで連結して <a href="http://xxx.xx.ne.jp/xx.cgi?1,3,5">リンク</a> と表示したいのですがどのように書けばいいのでしょうか。 よろしくお願いします。

みんなの回答

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.2

ご指定の仕様では引数の渡し方が変な感じがしますが とりあえず実現するには以下でいけます。 <script language=javascript> function checkFunc(){ var f=document.forms["f0"]; var url=""; var count=0; var array1 = new Array(); for (var i=0;i<f.length;i++){ if(f[i].name="ch" && f[i].checked==true) array1[count++]=f[i].value } if(array1.length>0){ url="http://xxx.xx.ne.jp/xx.cgi?"+array1.join(",") }else{ url="http://xxx.xx.ne.jp/xx.cgi" } //alert(url) location.href=url } </script> <FORM name="f0"> <INPUT name="ch" type="checkbox" value="1">1 <INPUT name="ch" type="checkbox" value="2">2 <INPUT name="ch" type="checkbox" value="3">3 <INPUT name="ch" type="checkbox" value="4">4 <INPUT name="ch" type="checkbox" value="5">5 </FORM> <a href="javascript:checkFunc()">リンク</a>

  • steel_gray
  • ベストアンサー率66% (1052/1578)
回答No.1

要件がハッキリしない部分があるのでご希望通りでないかもしれませんがとりあえずサンプル。 <html> <head> <title></title> <script type="text/javascript"> function makeAnchor() { var checkBox = document.getElementsByName('ch'); var L = checkBox.length; var checkedList = new Array(); for(var i=0;i<L;i++) { if(checkBox[i].checked) checkedList.push(checkBox[i].value); } var queryStr = checkedList.join(); if(queryStr) queryStr = '?'+queryStr; document.getElementById('here').innerHTML = '&lt;a href="http://xxx.xx.ne.jp/xx.cgi'+queryStr+'"&gt;リンク&lt;/a&gt;'; } </script> </head> <body> <p> <input name="ch" type="checkbox" value="1" id="ch_1"><label for="ch_1">1</label> <input name="ch" type="checkbox" value="2" id="ch_2"><label for="ch_2">2</label> <input name="ch" type="checkbox" value="3" id="ch_3"><label for="ch_3">3</label> <input name="ch" type="checkbox" value="4" id="ch_4"><label for="ch_4">4</label> <input name="ch" type="checkbox" value="5" id="ch_5"><label for="ch_5">5</label> </p> <p> <input type="button" value="ボタン" onclick="makeAnchor()"> </p> <p id="here"></p> </body> </html>

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

関連するQ&A

  • checkboxについておしえてください

    <form action=" " method="post"> <input type="checkbox" name=" figure" value="1"><img src="a.png"> <input type="checkbox" name=" figure" value="2"><img src="b.png"> <input type="checkbox" name=" figure" value="3"><img src="c.png"> <input type="checkbox" name=" figure" value="4"><img src="a.png"> <input type="checkbox" name=" figure" value="5"><img src="b.png"> <input type="submit" value="送信する"> </form> とした場合に、絵の左にくるチェックボックスの位置を、添付した図のように位置を図の中にもってこれないかと考えています。できれば、大きさも変えたいと考えています。 cssでできるのでしょうか？ cssじゃない方法などもあるのでしょうか？よろしくお願いいたします。

    • ベストアンサー
    • 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>

  • チェックボックス　連結

    恐れ入ります。 <input type=checkbox name=col1 value="1"> <input type=checkbox name=col1 value="2"> <input type=checkbox name=col1 value="3"> <input type=checkbox name=col1 value="4"> <input type=checkbox name=col1 value="5"> を、　1;2;3;4;5 と連結して同一フィールドへ送信し、 読み込み時に　分割して読み込みたいのですが、どのようにしたら良いでしょうか。 よろしくお願いします。

  • 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ではない！」 どうか教えて下さい。よろしくお願いします。

  • 大量の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>

  • htmlのcheckboxで質問です

    <form action=" " method="post"> <p> <input type="checkbox" name="riyu" value="1"><img src="a.png"> <input type="checkbox" name="riyu" value="2"><img src="b.png"> <input type="checkbox" name="riyu" value="3"><img src="c.png"> </p> <p> <input type="submit" value="送信する"> </p> </form> のようにして、絵の左にくるチェックボックスの位置や大きさを変えたいのですが、cssとかでできるのでしょうか？できれば絵に重なるようにチェックボックスを持ってきたいのですが。 cssじゃない方法などもあるのでしょうか？よろしくお願いいたします。

  • 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>

  • ＣＧＩでチェックボックスを使う方法

    チェックボックスをＣＧＩ（Ｃ言語）で使用する方法を教えて下さい。 例えば、ＨＴＭＬで <input type="checkbox" name="Check1" value="Sel11" /> チェック１　選択１<br /> <input type="checkbox" name="Check1" value="Sel12" /> チェック１　選択２<br /> <input type="checkbox" name="Check1" value="Sel13" /> チェック１　選択３ <hr /> <input type="checkbox" name="Check2" value="Sel21" checked /> チェック２　選択１<br /> <input type="checkbox" name="Check2" value="Sel22" /> チェック２　選択２<br /> <input type="checkbox" name="Check2" value="Sel23" checked /> チェック２　選択３ というプログラムはＣＧＩ（Ｃ言語）ではどの様に記述すれば良いでしょうか？

    • ベストアンサー
    • CGI
  • []を付けずに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

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する