• ベストアンサー

Javascript ポップアップウィンドウでのデータの受け渡し

よくある○○度チェックみたいなものを作っているのですが、 項目が10個程あって、 「チェックが0個~4個のあなたは、△△△!!」 「チェックが5個~7個のあなたは、◇◇◇!!」 「チェックが8個~10個のあなたは、◎◎◎!!」 という流れなのです。 で、その3パターンの結果ごとに異なる HTMLをポップアップウィンドウで表示させたいのです。 たいていは次のページに結果を表示させるパターンですが、ここをポップアップ表示させたいのです。 しかも3つそれぞれのHTMLに。 <script language="JavaScript"> function myCheck(){ myCnt=0 // チェックした数 for (i=0; i<document.myForm.length-1; i++){ // チェックボックスの数分ループ if (document.myForm.elements[i].checked == true){ // チェックはオンか? myCnt++ // チェック数 加算 } } if ( myCnt <= 3 ){ // チェックは 無し(ゼロ) myUrl = "check_1.html"; } else if ( myCnt <= 5 ){ // チェックは 1以上6以下 myUrl = "check_2.html"; } else if ( myCnt > 5 ){ // チェックは 1以上6以下 myUrl = "check_3.html"; } funMsgUrl(myUrl) } function funMsgUrl(url){ location.href = url } </script>  ・  ・  ・ <form name="myForm"> <input name="checkbox1" type="checkbox">項目<br> <input name="checkbox2" type="checkbox">項目<br> <input name="checkbox3" type="checkbox">項目<br>  ・  ・  ・ <input name="checkbox9" type="checkbox">項目<br> <input name="checkbox10" type="checkbox">項目<br> </form> <input type="button" onClick="myCheck(); return false;" value="チェック"> すみませんが、助言をお願いいたします。

  • n4416
  • お礼率46% (6/13)

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

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head><title>Untitled</title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript"> function myCheck(){ myCnt=0 // チェックした数 for (i=0; i<document.myForm.length-1; i++){ // チェックボックスの数分ループ if (document.myForm.elements[i].checked == true){ // チェックはオンか? myCnt++ // チェック数 加算 }} // チェックは 無し(ゼロ) if(myCnt==0)window.open('check_1.htm','sub','width=300,height=300'); // チェックは 1以上6以下 if(myCnt>0&&myCnt<7)window.open('check_2.htm','sub','width=300,height=300'); //チェックは 7以上 if(myCnt>=7)window.open('check_3.htm','sub','width=300,height=300'); } </script> </head><body> <form name="myForm"> <input name="checkbox1" type="checkbox">項目<br> <input name="checkbox2" type="checkbox">項目<br> <input name="checkbox3" type="checkbox">項目<br> <input name="checkbox4" type="checkbox">項目<br> <input name="checkbox5" type="checkbox">項目<br> <input name="checkbox6" type="checkbox">項目<br> <input name="checkbox7" type="checkbox">項目<br> <input name="checkbox8" type="checkbox">項目<br> <input name="checkbox9" type="checkbox">項目<br> <input name="checkbox10" type="checkbox">項目<br> <input type="button" onClick="myCheck()" value="チェック"> </form> </body> </html>

その他の回答 (1)

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

function funMsgUrl(url){ location.href = url } を function funMsgUrl(url){ window.open(url); } にする

参考URL:
http://www.htmq.com/js/window_open.shtml

関連するQ&A

  • JavaScriptに詳しい方居ますか?

    YESの数で診断するXX度チェックについてですが、 JavaScript は詳しくありません。 下記のものは、あるHPで見つけたものですが、 チェック項目を増やしたり出来ないものでしょうか? 出来るのであれば修正してもらえませんか 現在は5項目ですが、10項目にしたいと思っています 診断内容についても載っていたのをコピーして載せただけなので、 変更しようと思っています。 詳しい方、宜しくお願い致します。 <script language="JavaScript"><!-- function myCheck(){ myCnt=0; // チェックした数 for (i=0; i<document.myForm.length-1; i++){ // チェックボックスの数分ループ if (document.myForm.elements[i].checked == true){ // チェックはオンか? myCnt++; // チェック数 加算 } } if ( myCnt == 0 ) myMess="正常"; // チェックは 無し(ゼロ) else if ( myCnt <= 2 ) myMess="ちょヤバ"; // チェックは 1以上2以下 else if ( myCnt <= 4 ) myMess="危険気味"; // チェックは 3以上4以下 else myMess="完璧に危険"; // チェックは 全部(5) myComment = "危険度チェック 診断結果\n\nあなたは、"+myMess+"です!"; alert (myComment); } // --></script> <form name="myForm"> <input type="checkbox">たばこは1日20本以上吸う<br> <input type="checkbox">お酒を飲むと性格が変わる<br> <input type="checkbox">車を運転すると性格が変わる<br> <input type="checkbox">刃物を手にすると心がなごむ<br> <input type="checkbox">ピストルを所持している<br> <input type="button" onclick="myCheck()" value="診断"><br> </form>

  • チェックボックスで得たデータを送信する場合

    CGIでデータの受け渡しを行い、決められたアドレスへ結果を送信するアンケートをつくっています。以前、チェックボックスで複数回答可とした場合の制限のかけ方をJavaScriptを用いた方法で教えてもらいましたが、これを利用して得た値をCGIで受け取りたいのですが、どうやって設定すればいいのでしょうか。「name」がそれぞれ名前が違う所でつまずいています。また<form method=post action="***.cgi">~</form>と項目全体をくくればいいのでしょうか?参考までに以下のHTMLを付記いたします。 <html> <head> <title>5個のうち3個しかチェックできないようにする</title> <script Language="JavaScript"><!-- function check(n) { fOBJ = document.myFORM; count = 0; for (i=1; i<=5; i++) if (fOBJ["CB"+i].checked) count++; if (count > 2) { alert("3個以上チェックできません"); fOBJ["CB"+n].checked = false; } } // --></script> </head> <body> <form name="myFORM"> <input type="checkbox" name="CB1" onClick="check(1)">チェック1<br> <input type="checkbox" name="CB2" onClick="check(2)">チェック2<br> <input type="checkbox" name="CB3" onClick="check(3)">チェック3<br> <input type="checkbox" name="CB4" onClick="check(4)">チェック4<br> <input type="checkbox" name="CB5" onClick="check(5)">チェック5<br> </form> </body> </html>

    • ベストアンサー
    • CGI
  • JavaScriptでcheckboxの入力個数制限

    以下のようなチェックボックスがあります。 3つ以上チェックできないようにしたいのですが、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>

  • javascriptのsubmitを使ってデータをpost送信したい。

    javascriptのsubmitを使ってデータをpost送信したい。 aaa.phpというファイルに複数のチェックボックスがあり、リンクをクリックしたときに チェックされた値のみをbbb.phpへ引き渡したいです。 自分なりに書いてみましたが、bbb.phpへは遷移するものの、データが表示されません。 document.form1.method部分をGETにすると、データは表示されますが、POSTにすると うまく引渡しができません。 的外れな書き方をしているかもしれませんが、どなたかご教授いただけませんでしょうか? よろしくお願いいたします。 【追記】 チェックボックスの数は固定ではなく変動があり、値も実際はランダムです。 デザインの都合上どうしてもaタグでしか記述が出来ません。 ------------------------------------------------------------------------------ 【aaa.php】 <script language="JavaScript"> <!-- function mailform() {  var i = 0;  var chkvalue = "";  var count = 0;  var chk = document.getElementsByName('no');  for(i=0; i<chk.length; i++) {   if (chk[i].checked == true) {    chkvalue += chk[i].value;    count++;   }  }  if(count == 0) {   alert("チェックされていません。");   return false;  } else {   document.form1.action = "./bbb.php";   document.form1.method="post";   document.form1.submit();  } } //--> </script> <a href="#" onClick="send()">bbb.phpへ遷移する</a> <form name="form1">  <input type="checkbox" name="no" value="1"><br />  <input type="checkbox" name="no" value="2"><br />  <input type="checkbox" name="no" value="3"><br />  <input type="checkbox" name="no" value="4"><br /> </form> 【bbb.php】 var_dump($_POST["no"]);

  • javascript checkbox

    完全に初心者です。。 下記のスクリプトをもとに、 ■チェックAをチェックしたら全てチェックされる ■またチェックAをチェックしたら全て外れる ようにしたいです。。 でも何がダメか分かりません。。 一部を書くのではなく出来ればスクリプト全ていただけたらと思います。 あともし宜しければチェックAをチェックしたら、1~6をチェックできないようにもしたいです。。 ご教授よろしくお願いします。。 <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()">チェックA</p>   <INPUT type="checkbox" id="ch1">チェック1   <INPUT type="checkbox" id="ch2">チェック2   <INPUT type="checkbox" id="ch3">チェック3<BR><BR>   <INPUT type="checkbox" id="ch4">チェック4   <INPUT type="checkbox" id="ch5">チェック5   <INPUT type="checkbox" id="ch6">チェック6<BR><BR>   <BR> </FORM> </BODY> </HTML>

  • フォームに入力したデータの受け渡しについて

    左右に分かれたフレームを使用したページ作成を検討しています。 左フレーム内のフォームへ入力したテキストやチェックボックスのデータを、 右フレームに設置した1つのテキストエリアへコピーボタンで受け渡しを行う方法を探しています。 テキストボックス1行だけの受け渡しはできるのですが、 複数のテキストエリアやチェックボックスを使用した場合の受け渡し方法をご教示いただきたけますでしょうか? 左フレームとしては↓のような内容を想定しています。 <html> <form> テキスト:</br> <input type="text" name="aaa" /></br> ラジオ:</br> <input type="radio" name="bbb" value="radio1" checked="checked" /> ラジオ1 <input type="radio" name="bbb" value="radio2" /> ラジオ2</br> チェック:</br> <input type="checkbox" name="ccc" value="check1" /> チェック1 <input type="checkbox" name="ccc" value="check2" /> チェック2</br> 選択項目:</br> <select name="ddd"> <option>A</option> <option>B</option> </select></br> テキストエリア</br> <textarea name="eee" rows="2" cols="15">テキストエリア1</textarea> </br> <input type="submit" value="送信" />  <input type="reset" value="リセット" /> </form> </html> よろしくお願いいたします。

  • javascriptでチェックボックスの選択状況をチェックする方法につ

    javascriptでチェックボックスの選択状況をチェックする方法について質問です。 チェックボックスを <input type="checkbox" name="chk[]" value="1"> <input type="checkbox" name="chk[]" value="2"> のようにした場合、チェックボックスが1か所以上選択されているかどうかは、 var count = 0; for (var i=0;i<document.myform.elements['chk[]'].length;i++){ if(document.myform.elements['chk[]'][i].checked){ count++; } } if(count==0){ window.alert("チェックしてください!"); } のようにすればチェック可能ですが、inputタグで <input type="checkbox" name="chk1[]" value="1"> <input type="checkbox" name="chk1[]" value="2"> <input type="checkbox" name="chk2[]" value="A"> <input type="checkbox" name="chk2[]" value="B"> のように「name」の配列名が変化する場合はどのようにすればチェック可能でしょうか?

  • チェックボックスのデータ受け渡し

    アンケートフォームを作成しています。 アンケートの中で、チェックボックスを利用して業種を選んでもらう項目を作ろうと思うのですが、取得したデータの確認表示が上手くいかなくて困っています。 フォームの流れとしては 入力画面→確認画面→送信完了画面 と言う流れになります。 入力画面で下記のようなフォームを作ったのですが、確認画面で表示させる方法を教えていただきたいと思います。 <form name="form1" method="post" action="input.php"> <input name='check[] 'type='checkbox' id='check'value='飲食業'> 飲食業 <input name='check[] 'type='checkbox' id='check' value='小売業'> 小売業 <input name='check[] 'type='checkbox' id='check' value='サービス業'> サービス業 <input name='check[] 'type='checkbox' id='check' value='建築・不動産業'> 建築・不動産業 <input name='check[] 'type='checkbox' id='check' value='コンサルティング業'> コンサルティング業 <input name='check[] 'type='checkbox' id='check' value='その他'> その他 </form> 業種選択の他にも名前や会社名などの項目もあり、それらはセッションを利用し確認画面へ受け渡しています。 この業種選択の項目も、その他の項目と同じようにセッションを利用し、確認画面へ受け渡すことは可能でしょうか? 『飲食業、小売業、その他』のように、チェックしたもの全てを確認表示するような形にしたいのですが・・・ 宜しくお願いします

    • ベストアンサー
    • PHP
  • 【心理テスト作成】JavaScriptでページが表示されません

    チェックボックスを作り、 チェックが○個で「A」のページ、 チェックが○個で「B」のページ、 といったような簡易的な心理テストを作成したいと思い、 下記の方法を教えていただいたのですが、 正常に表示がされません(泣) 「送信」のボタンを押しても何もアクションが起こらないです… 私のPCに問題があるのでしょうか?? 申し訳ありません、 初心者でよく分かりませんのでよろしくお願い致します。 ▼ココからです▼ <html> <head> <title>Sample</title> <script language="JavaScript"> <!-- function jump() { count = 0; for (var i=0;i<document.sampleform.elements["check"].length;i++){ if ((document.sampleform.elements[i].name == "check") && (document.sampleform.elements[i].checked)) { count ++; } } if (count == 0) { // 一つもチェックされていない場合 location.href("​http://www.yahoo.co.jp");​ } else if (count <= 3) { // チェックが3個以下の場合 location.href("​http://www.google.co.jp");​ } else { // チェックが4個以上の場合 location.href("​http://www.msn.co.jp");​ } } //--> </script> </head> <body> <form name="sampleform"> <input type="checkbox" name="check" value="A"> A<br> <input type="checkbox" name="check" value="B"> B<br> <input type="checkbox" name="check" value="C"> C<br> <input type="checkbox" name="check" value="D"> D<br> <input type="checkbox" name="check" value="E"> E<br> <input type="button" value="送信" onclick="jump();"> </form> </body> </html>

  • チェックボックスにチェックしたファイルだけをダウンロードできるようにしたい

    サーバーにpdfファイルを10個保存しています。 HTMLページでチェックボックスにチェックを入れたpdfだけを ダウンロードできるようにURL入りの返信メールを自動的に送りたい のですが、やり方がわかりません。 どなたか詳しい人がおられましたら、教えていただけますでしょうか。 一応チェックボックスの過去の回答を見たのですが見当たりません。 (全て見れたわけではないですが) チェックボックス表示までは以下のところまでできたのですが。 よろしくお願いします。 <form> <input type="checkbox" name="グループ1" value="項目1">Apdf<br><br><br><br> <input type="checkbox" name="グループ1" value="項目2">Bpdf<br><br><br><br> <input type="checkbox" name="グループ1" value="項目3">Cpdf<br><br><br><br> <input type="checkbox" name="グループ1" value="項目4">Dpdf<br><br><br><br> <input type="checkbox" name="グループ1" value="項目5">Epdf<br><br><br><br> <input type="checkbox" name="グループ1" value="項目6">Fpdf<br><br><br><br> <input type="checkbox" name="グループ1" value="項目7">Gpdf<br><br><br><br> <input type="checkbox" name="グループ1" value="項目8">Hpdf<br><br><br><br> <input type="checkbox" name="グループ1" value="項目9">Ipdf<br><br><br><br> <input type="checkbox" name="グループ1" value="項目10">Jpdf<br><br><br><br> </form>

専門家に質問してみよう