ゲームの開始ボタン


【Source Code】
<body>
<h2>ゲームの開始ボタン</h2>

<script type="text/javascript">
Init();
Check();
</script>

関数は <head> の中で定義しています。
最初の呼び出しではパラメータが渡されません。
(window.location の長さが3文字以下のときはパラメータが渡されなかったと判断する)
ゲームのルールを表示して "mode" = 0 で "jyanken1.html"(このページ)を呼び出します。
type="hidden" は form には表示されない隠しアイテムで、遷移するときにパラメータとして渡します。
"score_m", "score_c" はプレイヤーとコンピューターの得点で、"cnt" はジャンケンの回数です。
<script type="text/javascript">
function Init()
{
    param = new Array();
    if (window.location.search.length<3)
    {   // 最初の呼び出し
        document.write("・あなたと私がじゃんけんをします<br>");
        document.write("・何で勝つかで得点が変わります<br>");
        document.write("・得点表は次のとおりです<br>");
        document.write('<table border="1">');
        document.write('<tr><th>手</th><th>勝ち</th><th>負け</th><th>あいこ</th></tr>');
        document.write('<tr><td>グー(0)</td><td>5点</td><td>-5点</td><td>3点</td></tr>');
        document.write('<tr><td>チョキ(1)</td><td>2点</td><td>0点</td><td>1点</td></tr>');
        document.write('<tr><td>パー(2)</td><td>15点</td><td>0点</td><td>0点</td></tr>');
        document.write('</table><br>');
        document.write('<form action="jyanken1.html" method="get">');
        document.write('<input type="hidden" name="mode" value=0>');
        document.write('<input type="hidden" name="score_m" value=0>');
        document.write('<input type="hidden" name="score_c" value=0>');
        document.write('<input type="hidden" name="cnt" value=0>');
        document.write('<input type="submit" value="開始">');
        document.write('</form>');
        return;
    }

「開始」ボタンがクリックされて呼び出されたときです。
param[] に Form から渡されたパラメータを取得します。
    else
    {   // パラメータを取得する
        var query = window.location.search.substring(1);
        var parameters = query.split('&');
        for(i=0; i<parameters.length; i++)
        {
            var element = parameters[i].split('=');
            var paramName = decodeURIComponent(element[0]);
            var paramValue = decodeURIComponent(element[1]);
            param[paramName] = parseInt(paramValue);
        }
    }
}

Check 関数はパラメータを確認する関数で、直接ゲームには関係しません。
// Parameter Check
function Check()
{
    if (param["mode"]==null)
    {   document.write("null Parameter<br>");
        return;
    }
    for(var key in param)
    {   var data = param[key];
        document.write(key, ": ", data, "<br>");
    }
}
</script>

[Next Chapter ↓] じゃんけんゲーム-2
[Previous Chapter ↑] じゃんけんゲーム

前田稔の超初心者のプログラム入門
超初心者のプログラム入門(JavaScript)