クイズの実験の解説

 今回はソースコードに注釈を入れてみました。(メールで質問されたので) 基本的にはHoroscapeRankingと同じです。問題文をランダムに選び、順番を決めるというところが、メインだと思います。 私の所の実験では変数の保持とか参照先によくフレームを使っていますので、それの応用例といったところでしょうか。(実は学生時代に学部の後輩の為に考えたアイデア) このパターンの応用は幾らでも考えられると思います。
 あと、考えてみれば当たり前なのですが、別のフレームの関数の呼び出しが可能だということに気づいたのが収穫でしょうか(^^;
 使用方法は、コメント文の先頭に「*」がついているところを自分なりにカスタマイズすれば出来上がります。使用するページがフレームの親、下に添付しているページ、問題を表示するページ(スタートページだけでよい)と結果表示のページの4つあります。 それぞれ好きなようにカスタマイズしてみてください。

<HTML> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=x-sjis"> <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- //配列用意用 function makeArray(k){ this.length=k } //*結果表示用ページを設定(quizresult.htmlを変更) function last(){ window.parent.frames[0].document.location="quizresult.html" } //解答のチェック function eq(A,B){ if(window.parent.frames[1].document.forms[0].elements[1].checked==false){ window.parent.frames[1].document.forms[0].elements[1].checked=true if(A==answer[Select[B]]){ score=window.parent.frames[1].document.forms[0].elements[0].value score++ window.parent.frames[1].document.forms[0].elements[0].value=score window.parent.frames[0].document.forms[0].elements[3].value="正解です!!" } else { window.parent.frames[0].document.forms[0].elements[3].value="ハズレです" } } } //出題 function quiz(I){ J=I+1 if(I>=number) { last() } else{ br=branch[Select[I]].split(",") window.parent.frames[1].document.forms[0].elements[1].checked=false //問題の表示 window.parent.frames[0].document.open() window.parent.frames[0].document.write("<HTML>\n") window.parent.frames[0].document.write("<BODY BGCOLOR=#000000 TEXT=#FFFFFF><font size=+2>\n") //問題と3択の表示 window.parent.frames[0].document.write("<FORM><DL><DT>"+question[Select[I]]+"</DT>\n") window.parent.frames[0].document.write("<DD><INPUT TYPE=\"radio\" value=1 onClick=\"window.parent.frames[1].eq(1,"+I+")\">"+br[0]+"</DD>\n") window.parent.frames[0].document.write("<DD><INPUT TYPE=\"radio\" value=2 onClick=\"window.parent.frames[1].eq(2,"+I+")\">"+br[1]+"</DD>\n") window.parent.frames[0].document.write("<DD><INPUT TYPE=\"radio\" value=3 onClick=\"window.parent.frames[1].eq(3,"+I+")\">"+br[2]+"</DD>\n") window.parent.frames[0].document.write("</DL>\n") window.parent.frames[0].document.write("<INPUT TYPE=\"text\" size=15>\n") window.parent.frames[0].document.write("<INPUT TYPE=\"button\" value=\"次の問題\" onClick=\"window.parent.frames[1].quiz("+J+")\">"); window.parent.frames[0].document.write("</DL></FONT></BODY></HTML>\n") window.parent.frames[0].document.close() } } function Init(){ //問題と解答の登録 //*toiに登録する問題の総数を設定する toi=3 question=new makeArray(toi) branch=new makeArray(toi) answer=new makeArray(toi) br=new makeArray(3) //*questionに問題文、branchにコンマで区切って3択、answerに答えの番号を設定 question[0]="日本の首都は?" branch[0]="東京,大阪に決まっている,北京だね" answer[0]=1 question[1]="WWWって何の略?" branch[1]="WorldWomanWonderful,WorldWideWeb,WhiteWoodWell" answer[1]=2 question[2]="11月3日って何の日?" branch[2]="体育の日,憲法記念日,文化の日" answer[2]=3 //*出題数の設定 number=3 //出題する問題と順番を決定 Select=new makeArray(number) for(i=0;i<number;i++){ rand=Math.round(Math.random()*10000) check=rand%(3-i) inc=0 inc2=0 while(1){ for(j=0;j<i;j++){ if(check>=Select[j]) inc++ } inc=inc-inc2 check=check+inc if(inc==0) break inc2=inc2+inc inc=0 } Select[i]=check } window.parent.frames[1].document.forms[0].elements[0].value=0 } // --> </SCRIPT> </HEAD> <BODY bgcolor="#000000" TEXT="#FFFFFF" onLoad="Init()"> <FORM> <INPUT TYPE="text" size=4 value=0> <INPUT TYPE="checkbox"> </FORM> </BODY> </HTML>