全体に噛み砕きました。エラー解説しました。
★ ジョナタタキ、解剖 ★

● ジョナタタキともぐらたたきの違い

  意図してそうなった事になるのかは解らないですが、ジョナタタキはもぐらたたきと違う点があります。
 叩く対象が一回一匹しかいないこと。
 最初はひょこひょこ出る感じで考えたのですが・・ジョナサン分裂しないじゃん・・?(いや、多分)
 ジョナタタキはもぐらたたきとしては未完成品です。そのうちレベルUPさせる予定ではあります。


● さぁ、ジョナタタキをつくろう!  →ジョナタタキ全ソースとフローチャート

↓フィールドは9つの同じ(大きさの)画像(場所)を並べて作っています。



左上が場所1、上中が場所2、上右が場所3、左中が場所4・・といった感じで、
名前を付けています。


 ジョナタタキを作るには、どんな処理が必要になるか考えます。

 1.ひょこひょことジョナの顔を出す。
  何もない穴の画像     ジョナが顔を出す動画
  →フィールドに「何もない穴の画像」か、「ジョナが顔を出す動画」を表示させる。
   ※ジョナは世界に1匹。(一度に2匹以上のジョナが顔を出さないようにする)
   ※次に何処に顔を出すのか解らなくする(出る場所の選定はランダム。)

 2.ジョナは叩いたらむしろ喜ぶ?スカったらバカにしそう・・(どんなイメージだよ)
  ジョナが叩かれている画像
  →「ジョナが顔を出す動画」をクリックされたら「ジョナが叩かれている画像」を表示させる。
   ※叩けた数(成果)もカウント。
  スカった時の画像
  →「何もない穴の画像」をクリックされたら「スカった時の画像」を表示させる。

 3.いつからいつまで続ける?顔を出すスピードは?
  たたく!!ボタンを押してから、40回ジョナが顔を出します。
  速さは(現在) 650/ミリ秒
 ※あと何匹か?が解るといいかな。

・・こんな感じのを組み合わせたらゲームになるかなァ?


 上記の処理のソースです。全体は ジョナタタキ全ソース で。

1.ひょこひょことジョナの顔を出す。(ジョナタタキ本処理)
  しくみは ランダムに画像を表示させる でどうぞ。基本の考えは同じかと。

imgn=Math.ceil(9*Math.random());
 ↓
 1〜9の整数をランダムで選ぶ

if(imgn==1){document.image1.src=jon2.src;}
else if(imgn==2){document.image2.src=jon2.src;} 
   〜 
else if(imgn==9){document.image9.src=jon2.src;}
 ↓
 整数が1ならば 場所1 に ジョナが顔を出す動画 を表示
 整数が2ならば 場所2 に ジョナが顔を出す動画 を表示
    〜
 整数が9ならば 場所9 に ジョナが顔を出す動画 を表示
 (ランダムに)選んだ整数の数字と場所を対応させ、何処に顔を出すかを決めています。


2.画像をクリックされたら画像を変える。点数もつける。(ジョナタタキ本処理、叩けたか否かの判定処理)
 しくみは マウスの動作で画像を入れ替える その他の考えは下記です。
document.tenForm.tokuten.value = ten;
  ↓
  得点の初期化。

function ten1(){
if(imgn==1){document.image1.src=jon3.src,ten=ten+1;}else{document.image1.src=jon4.src;}}
  〜
function ten9(){
if(imgn==9){document.image9.src=jon3.src,ten=ten+1;}else{document.image9.src=jon4.src;}}
 ↓
  ten1()から ten9()までは個々で分かれた、別々のものです。
 実行すると、「叩けた」か「スカ」かの判定します。
 判定はランダムで選んだ整数と叩いた場所が同じ数字であるか否かで判断します。
 「叩けた」ならjon3(ジョナが叩かれている画像)の表示と、捕獲数を+1
 「スカ」ならjon4(スカった時の画像)を表示させます。
<A href="javascript:ten1()"><img name="image1" width="42" height="42" border="0"/></A>
  〜
<A href="javascript:ten9()"><img name="image9" width="42" height="42" border="0"/><BR></A>
 ↓
 場所1(image1)がクリックされた時、ten1()を実行します。
   〜
 場所9(image9)がクリックされた時、ten9()を実行します。


3. いつからいつまで続ける?顔を出すスピードは?(1.の処理を一定時間続ける。)

 1)ゲーム開始判断
<input type="button" value="たたく!!" onclick="jonahajime()">
 ↓
  たたく!!ボタンをクリックしたら、ゲーム開始。
  (・・の前に判定処理一つ入ってますが、それは後ほど)

 2)ジョナが40回顔を出したら終わり。(ジョナタタキ本処理)
if(i<=39){
 ↓
 iが40より下の数字の時以下の処理を行う。

document.image1.src = jon1.src; 〜 document.image9.src = jon1.src;
 ↓
 一度全部の画像を「何もない穴の画像」にします。
 (繰り返し処理の2回目以降では、1.と2.の処理で
  「何もない穴の画像」以外の画像になっている所が有るため。)

i=i+1;
 ↓
 終了判定の為のカウント。

document.atoForm.toki.value = 40-i;
 ↓
 残数表示の為の引き算。

setTimeout("jonatataki()",650);
 ↓
 jonatataki()を650ミリ秒に一度実行する。
 ここの時点でjonatataki()の初めに戻ります。
 (上の処理が関連して・・i=40になるまで、繰り返し戻りつづける事になります。)


}else{  syoki(); }
 ↓
 iが40になった時 syoki() の実行。(最高得点以外のクリア。)
 こんな感じかなァ〜


 そうだ、叩いた成果によって、コメントとおまけをつけよう☆
 最高捕獲数によって変化するおまけ画像をかえる(おまけ画像表示処理、本処理)
document.saiForm.saikou.value = sai;
 ↓
 最高得点の初期化。

if(sai<=ten){sai=ten;}
document.tenForm.tokuten.value = ten; document.saiForm.saikou.value = sai;
 ↓
 最高得点と点数を比べて多い方を最高得点にします。

function omaira(){
if(sai==0){oma.src = "(おまけ画像1)"; document.ira.src= oma.src;
document.omaForm.omake.value = "・・みたね?"}
  〜
else if(sai<40){oma.src = "(おまけ画像11)"; document.ira.src= oma.src ;
document.omaForm.omake.value = "おめでとう!!";}}
 ↓
 処理をすると最高得点の点数により
 おまけ画像1から11のどれかと対応したコメントを表示。
<input type="button" value="おまけ☆ " onclick="omaira()">
 ↓
 おまけ☆ボタンをクリックしたら omaira() を実行。
 これで、なんとなく「ゲーム」になったでしょ?
 何?おまけがショボイ?ソレは技術が伴ってないので仕方ない〜(がくり)


 暴走エラーの正体  (張り切って紹介する事でも無いのですが・・)
 ◎当初、ゲーム作動中、たたく!!ボタンを誤って押してしまった場合
  ジョナの飛び出すペースが速くなった挙句、40匹出終わった後に
  再度、カウントがゼロに戻りスタート(再スタート)してしまう、というエラーがありました。

 よく見ると・・
 たたく!!ボタンを2回目以降押してしまった時点で、また新たに動作を始めている。
 つまり、同じプログラムが2つ同時に動作していました。かえるの歌のように。こういうのも並行処理?
 (私にはプログラムが同時に動作する、という考えが無かったので解らなかったのです)
 でも、そう考えると速くなってしまった理由も解りました。(多分2倍の速さだったんだと思います)

 たたく!!ボタンを押したのが、ゲーム中かどうか判定する事にしました。
※たたく!!ボタンを押した時に行う処理
 function jonahajime(){
 if(haji==0){haji = haji + 1; jonatataki();}}
   ↓
 haji が 0 ならば
 haji に 1 をたし、ジョナタタキの本処理を行う。
 haji が 0 以外なら何もしない

※ジョナが40匹出終わったあと、haji に 0を入れる。(syoki())
 haji=0
※上記に伴い、たたく!!ボタンの押した時の文も変わりました。
 違)<input type="button" value="たたく!!" onclick="jonatataki()">
   ↓
 正)<input type="button" value="たたく!!" onclick="jonahajime()">
これで、ジョナタタキ本処理を実行している間に、もう一度押されても大丈夫。
 javascript的にどうか、は知らないけど、多分、大丈夫でしょう!


 ☆ さあ、完成です〜!! →ジョナタタキへ!

●さいごに。

 如何でしたでしょうか?
 このページに出ている事が全てのやった事では無いですが、ポイントは抑えたつもりです。
 全ソースを見ることが出来ますので、にらめっこしてみて下さい。
 しかし、私はお世辞にも文章を書くのが上手いとは言えないので、
 言っている意味がわからんわ!!というお叱りの声もあるかと思います。
 その際、何処の何がわからないと言って下されば対応するように致します。
 ジョナタタキが、皆様のお役に立てれば幸いです。