![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?5a7ff87)
ラジオボタンを使って参考サイトのような診断テストを作りたいと思っています。
【参考サイト】
http://cgi.geocities.jp/socialpsychotan/test/shi …
ただ少し違うのが、あらかじめユーザーに
あなたが思う自分自身の人間力は?
「 」点
といったように数値を入力させ、診断結果とユーザー入力の数値を掛け合わせた
点数を表示する仕組みにしたいと考えています。
診断テストは全部で20問程度用意し、それぞれの質問に点数を仕込み
100点~80点ならユーザーが入力した数値×1.5
79点~60点ならユーザーが入力した数値×1.3
といったように表示させたいです。
下記のようなサイトを参考に、
http://jsfiddle.net/Tenderfeel/PFRCQ/
ラジオボタンのチェックで異なる答えを表示することはできるのですが
診断結果により数値を変動させる仕組みがわかりません。
お手数ですがご教授いただけないでしょうか。
よろしくお願いします。
![「【診断テストの作り方】結果に応じて数字を」の質問画像](http://oshiete.xgoo.jp/_/bucket/oshietegoo/images/media/0/542232142_55627f29cd123/M.png)
No.2ベストアンサー
- 回答日時:
シンプルに作るとこんな感じですかね
<body>
<script>
function getCheckTotal(){
$radio = $(':radio');
var total = 0;
$radio.filter(':checked').map(function(){
total += Number(this.value);
});
return total;
}
function calculate(){
//入力数値を取得
var inputPointString = $("#inputPoint").val();
//文字列で取得しているので数値に変換
var inputPoint = parseInt(inputPointString);
var checkTotal = getCheckTotal();
var calculateTotal = 0;
if(checkTotal >= 80){
calculateTotal = inputPoint* 1.5;
}
if(79 >= checkTotal && checkTotal >= 60){
calculateTotal = inputPoint* 1.3;
}
if(59 >= checkTotal && checkTotal >= 40){
calculateTotal = inputPoint* 1.3;
}
if(39 >= checkTotal){
calculateTotal = inputPoint;
}
if(isNaN(calculateTotal)){
$("#calculateTotal").val("未選択の項目があります");
}
else{
$("#calculateTotal").val(calculateTotal);
}
}
</script>
点数は?<input type="text" id="inputPoint" />
<fieldset>
<legend>質問1</legend>
<label><input type="radio" name="c1" value="10" /> はい</label>
<label><input type="radio" name="c1" value="5" /> どちらでもない</label>
<label><input type="radio" name="c1" value="1" /> いいえ</label>
</fieldset>
<fieldset>
<legend>質問2</legend>
<label><input type="radio" name="c2" value="10" /> はい</label>
<label><input type="radio" name="c2" value="5" /> どちらでもない</label>
<label><input type="radio" name="c2" value="1" /> いいえ</label>
</fieldset>
<fieldset>
<legend>質問3</legend>
<label><input type="radio" name="c3" value="10" /> はい</label>
<label><input type="radio" name="c3" value="5" /> どちらでもない</label>
<label><input type="radio" name="c3" value="1" /> いいえ</label>
</fieldset>
<button id="check" onclick="calculate()" >診断</button>
計算結果<input type="text" id="calculateTotal"/>
</body>
DoubtOwl様
再度ご丁寧に記述いただきありがとうございました。
おかげ様で思い通りの仕組みを作ることができました!
記述内容理解しながら進めていけるよう勉強を続けます。
ありがとうございました。
No.1
- 回答日時:
//入力数値を取得
var inputPointString = $("#inputPoint").val();
//文字列で取得しているので数値に変換
var inputPoint = parseInt(inputPointString);
合計値はとれているようなので判定するだけですね
var calculateTotal = 0;
if(total >= 80){
calculateTotal = inputPoint* 1.5;
}
if(79 >= total && total >= 60){
calculateTotal = inputPoint* 1.3;
}
if(59 >= total && total >= 40){
calculateTotal = inputPoint* 1.3;
}
...
DoubtOwl様
早々のご回答ありがとうございます。
お答えいただいたところ申し訳ないのですが、
書いてある内容についてはなんとなく理解できるのですが
実際それをどのように組み込めばいいのかがわかりません…。
お手数おかけしますがHTMLへの組み込み例も記載いただけないでしょうか。
何卒よろしくお願い致します。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Excel(エクセル) エクセルのセルの書式設定・ユーザー定義の条件設定について 1 2022/08/17 21:56
- その他(データベース) Accessフォームにて指定のフィールドの平均値を小数点第一位で表示できない 2 2022/08/30 17:19
- Access(アクセス) Accessテーブルの結合で別々のテーブルのフィールドを組み合わせて値を出す方法について 2 2022/07/20 19:43
- Visual Basic(VBA) Excel のユーザー定義関数でソルバーが動作しない 1 2022/09/05 19:51
- Excel(エクセル) Excelのマクロについて 2 2022/06/14 03:38
- 高校受験 高校入試で点数を上げたいです!! 5 2022/09/20 23:32
- 病院・検査 25歳女性です。 身長154.5cm 体重44.2kgです。 健康診断で肝臓の数値が引っかかりました 7 2022/07/24 14:07
- Excel(エクセル) ユーザー関数の自動計算(excel2003) 1 2023/02/06 06:46
- 高校受験 新中3です。今年の秋頃に学力診断テストというテストがあり、そのテストの点数で行ける高校が限られてしま 2 2022/04/02 21:56
- Excel(エクセル) エクセルでSUMIFS関数で条件範囲の部分が#valueになる。 4 2023/04/28 12:42
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ラジオボタンで選択した項目の...
-
location.href="http://www.aaa...
-
java jqueryのnameとid
-
ラジオボタンのチェックが外れ...
-
リセットボタンでクリアできな...
-
JavaScriptのfileオブジェクト...
-
C言語クイックソートの比較総回...
-
カレンダーに印を付けたい
-
ラジオボタンの選択でチェック...
-
VBScriptでpingを実行(ブラウザ...
-
confirmで2行メッセージを出力する
-
onchangeイベントを強制的に発...
-
クリックの度に加算していくには?
-
出発駅A、到着駅Bを選択すると...
-
入力フォームに半角スペース以...
-
プルダウンの値をphpファイルへ...
-
ユーザーフォームでの検索結果...
-
JSのボタンを複数う使うには
-
javascriptでプルダウンメニュ...
-
プルダウンで現在の年月日を取...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ラジオボタンにタブインデック...
-
データベースの値を判断してラ...
-
ラジオボタンのチェックが外れ...
-
ラジオボタンの値でリンク先を...
-
javascript作成してます。ラジ...
-
Jvasvriptのlengthで個数が取得...
-
ラジオボタンのValueを受け取り...
-
チェックされたラジオボタンに...
-
ラジオボタンの分岐方法に関して
-
ラジオボタンのリセット方法
-
ラジオボタンでdisabledとchecked
-
フォームPOST後「戻る」時のチ...
-
ラジオボタンのチェック数に応...
-
アンダーバーのname値は取得で...
-
ラジオボタンを使って、検索ペ...
-
ラジオボタン未チェックの場合...
-
リセットボタンでクリアできな...
-
javascriptによる動的なリンク...
-
javascriptでのアラート表示
-
【診断テストの作り方】結果に...
おすすめ情報