問題に対して、3つのヒントを用意してあるのですが、答えがわかった時点で回答に進めるようにしたJavascriptです。答えが表示されたら、ボタンを消して押せないようにしています。
前のページ（→こちら）を少しアレンジしたものです。
順番に3つのヒントを出したあとで正解が出るJavaScriptのプログラムの改良版で、回答がわかった時点でヒントを出さずに答えられるようにしています。
また、答えが表示されたら不要になった「ボタンを消す」… という変更をしていますので、前ページと比較して、さらにアレンジしていただくといいでしょう。
PR答えが分かったら答え合わせに進む
このプログラムは、「画像当てゲーム」のようなものを作るための過程で考えているもので、さらにバリエーションを加えると面白くなるでしょう。
例えば、たくさんの画像などを用意して、それを問題にしたり、タイマーを仕掛けて、早く答えると高い点数になる… などを組み込むことなどプラスしていくなどを考えていくと、さらに面白いものになると思います。
それに行き着く前段階で、ここでは、前のページを少し変えて、答えがわかった時点で「答え合わせ」にショートカットするように「答えボタン」をつけました。
そして、答えがわかったら、「分かった！」ボタンをおすと、「ヒントボタン」が消えるように変更しています。
国旗の国名当てクイズ2 を動かしてみましょう
どちらかのボタンを押します。 答えがわからない場合はヒント3つを順番に表示します。答えが分かった時点で「分かった！」ボタンを押しと答え合わせができるようにしました。
＊＊＊＊＊＊＊＊＊＊＊＊＊どちらかのボタンを押して進めてみましょう。
【問題】 この国旗はどこの国の国旗でしょうか？
ヒントを3つ用意しています。その後に答えが表示されますが
途中で「わかった！」ボタンを押すと「答え」が出ます。
ここに【ヒント】が表示されます。
＊＊＊＊＊＊＊＊＊＊＊ここまでがプロクラムで動作しています。
（注）もう一度初めから表示させる場合は、再読み込み（F5）をしてください。
「ページのソースを表示」でコードを確認できます
ここではコードを示していませんので、必要な方は、「ページのソースを表示」させて「＊＊＊＊ここから…～＊＊＊＊＊ここまで…」のところをご覧ください。
変更部分でチェックするところは、
①ボタンを追加した
<button id="myBtn" onclick="mySerect()">第1ヒントを見る</button>
<button id="myAns" onclick="myLast()"> 分かった！</button>
②途中で答えがわかったら「分かった！ボタン」で新しい関数を作ってそこに飛ばした
function myLast() {
③必要のなくなった2つのボタンを消している
document.getElementById('myBtn').remove();
document.getElementById('myAns').remove();
… というところが前のページと変わっています。
