【診断テストの作り方】結果に応じて数字を変動させる

解決済

質問者：質問さん
質問日時：2015/05/25 10:48
回答数：2件

ラジオボタンを使って参考サイトのような診断テストを作りたいと思っています。
【参考サイト】
http://cgi.geocities.jp/socialpsychotan/test/shi …

ただ少し違うのが、あらかじめユーザーに

あなたが思う自分自身の人間力は？
「　　　　」点

といったように数値を入力させ、診断結果とユーザー入力の数値を掛け合わせた
点数を表示する仕組みにしたいと考えています。

診断テストは全部で20問程度用意し、それぞれの質問に点数を仕込み
100点～80点ならユーザーが入力した数値×1.5
79点～60点ならユーザーが入力した数値×1.3
といったように表示させたいです。

下記のようなサイトを参考に、
http://jsfiddle.net/Tenderfeel/PFRCQ/
ラジオボタンのチェックで異なる答えを表示することはできるのですが
診断結果により数値を変動させる仕組みがわかりません。

お手数ですがご教授いただけないでしょうか。
よろしくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： DoubtOwl
回答日時：2015/05/26 10:53

シンプルに作るとこんな感じですかね

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

- 0
- 件

通報する

この回答へのお礼

DoubtOwl様

再度ご丁寧に記述いただきありがとうございました。
おかげ様で思い通りの仕組みを作ることができました！

記述内容理解しながら進めていけるよう勉強を続けます。
ありがとうございました。

通報する

お礼日時：2015/05/26 15:55

No.1

回答者： DoubtOwl
回答日時：2015/05/25 11:59

//入力数値を取得

- 0
- 件

通報する

この回答へのお礼

DoubtOwl様

早々のご回答ありがとうございます。

お答えいただいたところ申し訳ないのですが、
書いてある内容についてはなんとなく理解できるのですが
実際それをどのように組み込めばいいのかがわかりません…。

お手数おかけしますがHTMLへの組み込み例も記載いただけないでしょうか。
何卒よろしくお願い致します。

通報する

お礼日時：2015/05/25 14:57

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！