- ベストアンサー
JavaScriptで診断チェックリストを作る方法
- JavaScriptを使用して、同じページのフォーム内で質問チェックリストを作成する方法について教えてください。
- 質問チェックリストには10の質問があり、それぞれに非常に良い、良い、普通、悪いの4段階で評価する方法を導入したいです。
- 質問の答えをポイントに変換して、最後に合計ポイントを表示する方法についても教えてください。
- garys
- お礼率100% (5/5)
- JavaScript
- 回答数3
- ありがとう数4
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
こんばんわぁ、Blackwinglsです。 > 合計は、「action="mailto:」ではなく、単純にボタンを > クリックしてテキストエリアに合計が表示されるように > したい <form name="sindan" action="mailto:hoge@hogehoge.com" method="post" enctype="text/plain"> を <form name="sindan" onSubmit="return false;"> に変更してみてください。 ではでは～☆彡
その他の回答 (2)
- Blackwingls
- ベストアンサー率44% (138/313)
こんばんわぁ、Blackwinglsです。 > 小計までは出せるのですが、・・・・ これをどう出してるかによってScriptが変わってくるのですが(^^;) 昔、私が作って自分のWebPageにアップしているのは、以下のようなもんです。 参考にしてください。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <meta name="GENERATOR" content="Microsoft FrontPage Express 2.0"> <title>sindan</title> <script language="JavaScript"> <!-- function chg() { for (i=0; i<num; i++) { if(document.forms[0].elements[i].checked==true) { document.all("L"+i).style.color="red" } else { document.all("L"+i).style.color="Black" } } } function chg2() { for (i=0; i<num; i++) { document.all("L"+i).style.color="Black" } } function Diagnosis() { flag =0 toku = new Array() setumon = new Array() for (i=0; i<num; i++) { if(document.forms[0].elements[i].checked==true) { toku[i]=parseInt(document.forms[0].elements[i].value) j = Math.floor(i/3)+1 setumon[j] = toku[i] flag = flag + 1 } } if(flag == 10) { setumon_a = setumon[1] + setumon[3] + setumon[5] setumon_b = setumon[7] + setumon[9] setumon_c = setumon[2] + setumon[4] + setumon[6] + setumon[8] + setumon[10] sougoukei = setumon_a + setumon_b + setumon_c document.forms[0].syoukei_a.value = setumon_a document.forms[0].syoukei_b.value = setumon_b document.forms[0].syoukei_c.value = setumon_c document.forms[0].sougoukei.value = sougoukei } else { alert("全ての項目が入力されてません") } } //--> </script> </head> <body onLoad="chg()"> <hr> <form name="sindan" action="mailto:hoge@hogehoge.com" method="post" enctype="text/plain"> <b>Ｑ１：ＨＰは・・・・</b><br> <input type="radio" name="q1" onClick="chg()" value=0><span id=L0>ヒューレットパッカードのこと</span><br> <input type="radio" name="q1" onClick="chg()" value=1><span id=L1>ホームページのこと</span><br> <input type="radio" name="q1" onClick="chg()" value=2><span id=L2>ヒットポイント！！</span><br> <b>Ｑ２：ブラインドタッチは・・・・</b><br> <input type="radio" name="q2" onClick="chg()" value=0><span id=L3>チャットで覚えた</span><br> <input type="radio" name="q2" onClick="chg()" value=1><span id=L4>専用ソフトでおぼえた</span><br> <input type="radio" name="q2" onClick="chg()" value=2><span id=L5>できないっす</span><br> <b>Ｑ３：クロックアップは・・・・</b><br> <input type="radio" name="q3" onClick="chg()" value=0><span id=L6>何時もやっている</span><br> <input type="radio" name="q3" onClick="chg()" value=1><span id=L7>やろうと思ったことはある</span><br> <input type="radio" name="q3" onClick="chg()" value=2><span id=L8>それって何？</span><br> <b>Ｑ４：Windowsのクリーンインストールは・・・・</b><br> <input type="radio" name="q4" onClick="chg()" value=0><span id=L9>定期的にやっている</span><br> <input type="radio" name="q4" onClick="chg()" value=1><span id=L10>不具合が出てからやっている</span><br> <input type="radio" name="q4" onClick="chg()" value=2><span id=L11>たぶん、人に頼むしかないっす</span><br> <b>Ｑ５：LAN環境が・・・・</b><br> <input type="radio" name="q5" onClick="chg()" value=0><span id=L12>自宅でサーバーをたてて構築</span><br> <input type="radio" name="q5" onClick="chg()" value=1><span id=L13>Windowsのファイル共有程度なら</span><br> <input type="radio" name="q5" onClick="chg()" value=2><span id=L14>家庭内乱なら年中です</span><br> <b>Ｑ６：メインのＯＳは・・・・</b><br> <input type="radio" name="q6" onClick="chg()" value=0><span id=L15>Unix系</span><br> <input type="radio" name="q6" onClick="chg()" value=1><span id=L16>Windows系</span><br> <input type="radio" name="q6" onClick="chg()" value=2><span id=L17>ＯＳって何？</span><br> <b>Ｑ７：2chは・・・・</b><br> <input type="radio" name="q7" onClick="chg()" value=0><span id=L18>常連です</span><br> <input type="radio" name="q7" onClick="chg()" value=1><span id=L19>たまには見る程度</span><br> <input type="radio" name="q7" onClick="chg()" value=2><span id=L20>ＮＨＫ？</span><br> <b>Ｑ８：串とか鯖とか・・・・</b><br> <input type="radio" name="q8" onClick="chg()" value=0><span id=L21>ぽろっと出てしまう</span><br> <input type="radio" name="q8" onClick="chg()" value=1><span id=L22>まぁ意味なら分かるけど</span><br> <input type="radio" name="q8" onClick="chg()" value=2><span id=L23>鯖の串焼き？</span><br> <b>Ｑ９：文章を打つなら・・・・</b><br> <input type="radio" name="q9" onClick="chg()" value=0><span id=L24>エディタが一番</span><br> <input type="radio" name="q9" onClick="chg()" value=1><span id=L25>Wordでしょう</span><br> <input type="radio" name="q9" onClick="chg()" value=2><span id=L26>紙と鉛筆が・・・</span><br> <b>Ｑ１０：パソコン無しだと・・・・</b><br> <input type="radio" name="q10" onClick="chg()" value=0><span id=L27>生きていけない</span><br> <input type="radio" name="q10" onClick="chg()" value=1><span id=L28>不便だよね</span><br> <input type="radio" name="q10" onClick="chg()" value=2><span id=L29>だから・・・それって食えるの？</span><br> <p> <input type="submit" value="診断開始" accesskey="y" onClick="Diagnosis()"> <input type="reset" value=" リセット " accesskey="n" onClick="chg2()"> </p> 小計Ａ ： <input type="text" name="syoukei_a" value="0" size="10" style="text-align:right"><br> 小計Ｂ ： <input type="text" name="syoukei_b" value="0" size="10" style="text-align:right"><br> 小計Ｃ ： <input type="text" name="syoukei_c" value="0" size="10" style="text-align:right"><br> 総合計： <input type="text" name="sougoukei" value="0" size="10" style="text-align:right"><br> </form> <script language="JavaScript"> <!-- var num = document.forms[0].length-6 //--> </script> </body> </html> 詳しく動作確認はしていません。 ではでは～☆彡
お礼
ご丁寧な回答ありがとうございます。 教えていただいたスクリプトでうまくいきそうに思うのですが、 合計は、「action="mailto:」ではなく、単純にボタンを クリックしてテキストエリアに合計が表示されるように したいのですが、おそらく「function Diagnosis() 」以下を変更すると思うのですが、ご教授いただけますでしょうか。 初心者で申し訳ありませんが、よろしくお願いいたします。
- Blackwingls
- ベストアンサー率44% (138/313)
こんばんわぁ、Blackwinglsです。 総合計Ｄ = 小計Ａ + 小計Ｂ + 小計Ｃ とするか 総合計Ｄ = 質問1 + 質問2 + 質問3 + ・・・・・ + 質問10 とするかのどちらか(^^;) 具体的内容は > 合計点をつけるような診断チェックリストが3種類ありまして、・・・ 上記Scriptでその得点を、どのように変数処理してるか次第ですね。 ではでは～☆彡
お礼
さっそくのご回答ありがとうございます。 総合計は、 総合計Ｄ = 小計Ａ + 小計Ｂ + 小計Ｃ と考えています。 小計までは出せるのですが、これらの合計をどうしたら よいものか途方にくれております。 合計点は各質問の点数（0点、1点、2点、3点のいずれか）の合計をそれぞれの群の小計に、 そしてその総合計を表示させたいのです。 お分かりの方がおられましたら、ご教授いただけましたら 幸いです。m(_ _)m
お礼
本当にご丁寧な回答いただいてありがとうございました。 思ったとおりのページができました。 感謝、感謝でございます。m(_ _)m