FC2ブログの記事内でラジオボタンを設置して択一クイズが作りたいです。
下記のプログラムを、ブログパーツのフリーエリアに入力すると、サイドメニューでは正常に動作します。
しかし、記事内に入力すると、ラジオボタンにチェックは入れられるのですが、採点ボタンを押しても反応しません。
どうすれば、ブログの記事内で、動作するのでしょうか?また、下記のプログラムに限らず可能なものがあれば教えてください。
プログラムを公開されている方のホームページには、メールフォームやコメント欄がないので、直接伺うことができませんでした。http://www.pori2.net/js/form/4.html
宜しくお願いします。
<form name="radioB">
カナダの首都は?<br>
<input type="radio" name="Q1">オタワ<br>
<input type="radio" name="Q1">トロント<br>
<input type="radio" name="Q1">モントリオール<br>
<br>
スイスの首都は?<br>
<input type="radio" name="Q2">ジュネーブ<br>
<input type="radio" name="Q2">チューリッヒ<br>
<input type="radio" name="Q2">ベルン<br>
<br>
ドイツの首都は?<br>
<input type="radio" name="Q3">ハンブルク<br>
<input type="radio" name="Q3">ブレーメン<br>
<input type="radio" name="Q3">ベルリン<br>
<br>
スペインの首都は?<br>
<input type="radio" name="Q4">バルセロナ<br>
<input type="radio" name="Q4">マドリード<br>
<input type="radio" name="Q4">リスボン<br>
<br>
オーストラリアの首都は?<br>
<input type="radio" name="Q5">シドニー<br>
<input type="radio" name="Q5">メルボルン<br>
<input type="radio" name="Q5">キャンベラ<br>
<br>
<input type="button" value="採点" onclick="saiten()" />
</form>
<script>
function saiten(){
var seikai=0; //正解数を入れる変数
//答えの番号を配列に入れる
var trueAns = new Array(0,5,8,10,14);
//正解のラジオボタンがチェックされているか確認
for (i=0 ; i<5 ; i++)
{
if( document.radioB.elements[trueAns[i]].checked )
seikai++;
}
alert("あなたは"+seikai*20+"点でした!");
}
</script>
No.3ベストアンサー
- 回答日時:
記事ごとに違う問題と回答なら、こんな感じでしょうか。
ポイントとしては、選択肢に値をつけることと、
関数 saiten の引数に対象フォームと回答を含めることです。
<script>
function saiten(name,answers){
var readRadio = function(radios) {
for (var d = 0; d < radios.length; d++ ) if (radios[d].checked) return radios[d].value;
return null;
}
var form = document.forms[name];
var seikai = 0;
for (var i in answers) {
var e = form.elements[i]; if (!e) continue;
if (answers[i] == readRadio(e)) seikai++;
}
var score = seikai * 20;
alert("あなたは"+score+"点でした!");
return false;
}
</script>
<form name=radioB>
<p>カナダの首都は?
<ul>
<li> <label><input type=radio name=Q1 value=1>オタワ</label>
<li> <label><input type=radio name=Q1 value=2>トロント</label>
<li> <label><input type=radio name=Q1 value=3>モントリオール</label>
</ul>
中略
<p><button type=button onclick="saiten('radioB',{Q1:'1',Q2:'3',Q3:'3',Q4:'2',Q5:'3'})">採点</button>
</form>
No.2
- 回答日時:
ANo.1の補足です。
>↓この部分ですよね。
→そうです。
>1記事ごとに質問・正解が違うものにしたいです。記事ごとにスクリプトの記述は、
変えれるのでしょうか?
→現在のスクリプトのロジックでは変更できません。
変更するためには、onclickでスクリプトをコールするときに正解の変数を
指定し、スクリプト側でこれを受け取って答えの番号の配列に入れるように
ロジックを変更する必要があります。
javascriptの基本を、もう少し勉強する必要がありますね。
No.1
- 回答日時:
設定-テンプレートの設定画面のHTML編集で、<head>~</head>の間に
スクリプトを定義してみてください。
この回答への補足
↓この部分ですよね。
<script>
function saiten(){
var seikai=0; //正解数を入れる変数
//答えの番号を配列に入れる
var trueAns = new Array(0,5,8,10,14);
//正解のラジオボタンがチェックされているか確認
for (i=0 ; i<5 ; i++)
{
if( document.radioB.elements[trueAns[i]].checked )
seikai++;
}
alert("あなたは"+seikai*20+"点でした!");
}
</script>
--------------------------------------------------
↓この部分が記事ごとに変わらないと次のページでも正解の順番が同じなりますよね?
//答えの番号を配列に入れる
var trueAns = new Array(0,5,8,10,14);
1記事ごとに質問・正解が違うものにしたいです。記事ごとにスクリプトの記述は、変えれるのでしょうか?
他の方法でも結構ですので、ご指導ください。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- PHP $_SESSIONについて教えて下さい。 2 2023/03/02 09:18
- PHP 入力した部分を表示させたまま(保持)するにはどうすれば良いでしょうか? 1 2023/01/25 11:14
- PHP PHPで画像の渡しが上手く行きません。 1 2023/02/02 09:39
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- PHP PHPのエラーの解消法について教えて下さい。 1 2023/02/06 10:48
- PHP PHPでユーザー情報を入力して簡易ログイン機能をつくってみたのですが 1 2023/05/29 08:51
- HTML・CSS 私の能力からして間違っていないような気がします。 4 2022/09/30 13:24
- HTML・CSS ただいま勉強始めたての初心者です。フォームを縦並べにしたいです。 2 2022/11/20 17:18
- CGI htmlからパラメータで、cgiに渡したい。 1 2023/02/06 16:15
- PHP php ログイン 1 2022/11/01 00:24
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ラジオボタンにタブインデック...
-
ラジオボタンの値でリンク先を...
-
チェックボックスのON/OFFに連...
-
データベースの値を判断してラ...
-
アンダーバーのname値は取得で...
-
JavaScriptでラジオボタンのチ...
-
複数のラジオボタンでの選択で...
-
ラジオボタンのalertのコントロ...
-
fc2ブログの記事内で、ラジオボ...
-
javascript作成してます。ラジ...
-
チェックされたラジオボタンに...
-
ラジオボタンによるメニューの操作
-
ラジオボタンでFORMの属性を切...
-
jsでラジオボタンによって表示...
-
ラジオボタンとif文
-
ラジオボタンで選択した項目の...
-
ラジオボタンのチェックが外れ...
-
リンク文字クリックでラジオボ...
-
javascriptでセレクトボックス...
-
javascriptでhiddenに二次元配...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ラジオボタンにタブインデック...
-
データベースの値を判断してラ...
-
ラジオボタンのチェックが外れ...
-
ラジオボタンの値でリンク先を...
-
javascript作成してます。ラジ...
-
Jvasvriptのlengthで個数が取得...
-
ラジオボタンのValueを受け取り...
-
チェックされたラジオボタンに...
-
ラジオボタンの分岐方法に関して
-
ラジオボタンのリセット方法
-
ラジオボタンでdisabledとchecked
-
フォームPOST後「戻る」時のチ...
-
ラジオボタンのチェック数に応...
-
アンダーバーのname値は取得で...
-
ラジオボタン未チェックの場合...
-
javascriptでのアラート表示
-
javascriptによる動的なリンク...
-
ラジオボタンを使って、検索ペ...
-
リセットボタンでクリアできな...
-
ラジオボタンで選択した項目の...
おすすめ情報