ラジオボタンで診断テストを作成したい
Yes、No形式で10問のラジオボタンから選択し、
Yesの数に応じ5通りのリンク先にジャンプするようなサイトを作成しようと思っています。
調べているうちに下記のような同様の質問を発見したのですが、
http://detail.chiebukuro.yahoo.co.jp/qa/question …
これだと2の10乗、1024通りのリンクを設定しないといけません。
例えばYesを1、Noを0などの数値に置き換えて、
Yesの数が1-3個は"http://~~"、4-6個は"http://~~"
という風には設定できないのでしょうか?
わかりにくい説明で申し訳ありませんが、
よろしくお願いします。
No.6ベストアンサー
- 回答日時:
他の方の回答から一部もらってますがサンプルです。
<script type="text/javascript">
function sample(F){
var list = {
0:'htp://example.com/a.html',//0以下
2:'htp://example.com/b.html',//2以下
5:'htp://example.com/c.html',
8:'htp://example.com/d.html',
10:'htp://example.com/e.html'
};
var i=0;
var q;
var c=0;
var key=0;
while( q = F.elements[ i++ ] )
if(q.type=='radio' && q.checked) c+= parseInt(q.value);
for(key in list) {
if(c <= parseInt(key)) {
location.href = list[key];
break;
}
}
return false;
}
</script>
</head>
<body>
<form onsubmit="return sample(this)">
<p>
Q1.
<label><input type="radio" name="q1" value="1" checked>Yes</lebel>
<label><input type="radio" name="q1" value="0">No</lebel>
</p>
<p>
Q2.
<label><input type="radio" name="q2" value="1" checked>Yes</lebel>
<label><input type="radio" name="q2" value="0">No</lebel>
</p>
~略~
<input type="submit" value="診断">
</form>
Yesのvalueを2以上にしたり、
Yesを0、Noを1にすることで結果予測をしずらくすることもできます。
No.5
- 回答日時:
>babu_babooさん
あ、そうかぁ。アレではグローバル変数になってしまうんですね^^;
1つ勉強になりました、ありがとうございます。
var
i,
r = document.getElementById("form1").getElementsByTagName( 'input' ),
yc = 0,
nc = 0;
に訂正します。
No.3
- 回答日時:
あ~ちぇっくがあまかった。
どっちみち、radio で checked == true で value="yes" をかうんとするだけ
<!DOCTYPE html>
<title></title>
<body>
<form action="#">
<p>
<input type="radio" name="q1" value="yes" checked>
<input type="radio" name="q1" value="no">
</p>
<p>
<input type="radio" name="q2" value="yes" checked>
<input type="radio" name="q2" value="no">
</p>
<p>
<input type="button" value="check" onclick="jump()">
</p>
<script type="text/javascript"><!--
function jump() {
var c = 0,
i = 0,
p = document.getElementsByTagName( 'input' ),
q;
while( q = p[ i++ ] )
c += ('radio' == q.type && q.checked && 'yes' == q.value);
location.href=[
'htp:ww0.ne.jp',
'htp:ww1.ne.jp',
'htp:ww2.ne.jp',
'htp:ww3.ne.jp'
][c];
}
</script>
No.2
- 回答日時:
<script type="text/javascript">
<!--
function sample() {
var
i,
r = document.getElementById("form1").getElementsByTagName( 'input' ),
yc = nc = 0;
for( i = 0; i < r.length; i+=2 ){
if( r[i].type == 'radio' && r[i+1].type == 'radio'){
yc += ( r[i].checked ); nc += ( r[i+1].checked );
}
}
if( yc + nc != 10 ){
window.alert("いくつかチェックし忘れています。");
return false;
}
alert(yc);
return false;
}
//-->
</script>
</head>
<body>
<form name="form1" id="form1" action="#" onsubmit="return sample();">
<p>
<label for="y1"><input type="radio" name="q1" id="y1" value="yes">yes</label>
<label for="n1"><input type="radio" name="q1" id="n1" value="non">non</label>
</p>
<p>
<label for="y2"><input type="radio" name="q2" id="y2" value="yes">yes</label>
<label for="n2"><input type="radio" name="q2" id="n2" value="non">non</label>
</p>
<p>
<label for="y3"><input type="radio" name="q3" id="y3" value="yes">yes</label>
<label for="n3"><input type="radio" name="q3" id="n3" value="non">non</label>
</p>
<p>
<label for="y4"><input type="radio" name="q4" id="y4" value="yes">yes</label>
<label for="n4"><input type="radio" name="q4" id="n4" value="non">non</label>
</p>
<p>
<label for="y5"><input type="radio" name="q5" id="y5" value="yes">yes</label>
<label for="n5"><input type="radio" name="q5" id="n5" value="non">non</label>
</p>
※※文字数制限につき中略※※
<p>
<label for="y8"><input type="radio" name="q8" id="y8" value="yes">yes</label>
<label for="n8"><input type="radio" name="q8" id="n8" value="non">non</label>
</p>
<p>
<label for="y9"><input type="radio" name="q9" id="y9" value="yes">yes</label>
<label for="n9"><input type="radio" name="q9" id="n9" value="non">non</label>
</p>
<p>
<label for="ya"><input type="radio" name="qa" id="ya" value="yes">yes</label>
<label for="na"><input type="radio" name="qa" id="na" value="non">non</label>
</p>
<p><input type="submit" value="check"></p>
</form>
</body>
</html>
とか。
あとはyes/nonの数を元にどのように分岐したいのかを提示すれば、
より良い回答がつくと思います
No.1
- 回答日時:
にちようび。
こんなのは?(ぜんかくくうはくは、はんかくに)
function jump() {
var c = 0,
i = 0,
p = document.getElementsByTagName( 'input' ),
q;
while( q = p[ i++ ] )
c += ('radio' == q.type && q.checked);
location.href=[
'htp:ww0.ne.jp',
'htp:ww1.ne.jp',
'htp:ww2.ne.jp',
'htp:ww3.ne.jp'
][c];
}
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- 経営情報システム accessでの請求管理について 12 2022/06/11 16:20
- JavaScript jquery 診断コンテンツにチェックボックスを付けたいです 3 2023/01/19 18:31
- Microsoft ASP グーグルフォーム 1 2022/12/30 18:16
- C言語・C++・C# プログラミングの問題です。至急教えてください。 /***から***/の部分をプログラミングにしてほし 1 2022/10/13 11:48
- 中学校 英語での答え方はこれで正解ですか? (このように実際に聞くかとかは別として、あくまでも文法として) 2 2022/11/19 17:52
- Excel(エクセル) たくさんあるフォームコントロールを効率よく確認するには 1 2022/12/24 12:27
- 教育ソフト・学習ソフト 診断ツールを作るアプリ 3 2022/05/11 13:07
- JavaScript JavaScriptの条件分岐について(yes noチャート)で悩んでおります。 Q1は2択(ab) 5 2023/04/15 11:44
- 英語 Are you not feeling good?のYes,Noの答え方 2 2023/03/12 02:54
- Access(アクセス) Accessに関する質問です。 クエリーQ出勤 からフォームF出勤を作成 フォームは分割フォームで作 1 2023/05/26 08:57
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
Jvasvriptのlengthで個数が取得...
-
任意のinput要素同士の連動につ...
-
チェックされた項目を、指定さ...
-
ラジオボタンで診断テストを作...
-
JavaScriptでラジオボタンのチ...
-
ラジオボタンの選択内容により...
-
リセットボタンでクリアできな...
-
ラジオボタンをチェックした時...
-
ラジオボタンでdisabledとchecked
-
イベント時のラジオボタンについて
-
フォーム内で記入したクエリ送...
-
正規表現で複数マッチ条件で悩...
-
【javascript・PHP】プルダウン...
-
javascriptでセレクトボックス...
-
return trueとreturn falseの用...
-
VBScriptでpingを実行(ブラウザ...
-
ラジオボタンの選択で解答・点...
-
UWSCのIE操作でプルダウンを選...
-
親子連動型のselectを設置し、...
-
VBScript
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ラジオボタンのチェックが外れ...
-
javascript作成してます。ラジ...
-
ラジオボタンにタブインデック...
-
Jvasvriptのlengthで個数が取得...
-
ホームページ作成について。
-
データベースの値を判断してラ...
-
フォームPOST後「戻る」時のチ...
-
ラジオボタンでdisabledとchecked
-
Form内のselectを連動させるに...
-
アンダーバーのname値は取得で...
-
チェックされたラジオボタンに...
-
jQueryで複数のラジオボタンを処理
-
ラジオボタンのリセット方法
-
ラジオボタンの分岐方法に関して
-
javascriptによる動的なリンク...
-
radio選択をクッキーに保存させ...
-
JavaScriptでラジオボタンのチ...
-
jQuery 変数の使い方について
-
チェックボックスのON/OFFに連...
-
ラジオボタンでチェックした項...
おすすめ情報