ランダムなスクリプトで作成されたフォームのクライアントサイドでのJavaScriptフォームの検証

Question

私は自分の計算で息子を助けるために私の計算のためにwebappをやっています。

ページをリロードするたびに、新しいテストが提供されます。私が欠けているのは、クライアント側の検証です。以前はjQueryを使っていましたが、何かランダムには使用しませんでした。 質問のランダムな文字列を作成する小さなコードです。

問題は、リアルタイムで回答を検証する方法がないことです。

<tbody><tr> 
    <td><li class="smallfield"><span class="name"><script language="JavaScript"> 
<!-- 
var r_text = new Array(); 
r_text[0] = "1 x 1 ="; 
r_text[1] = "1 x 2 ="; 
r_text[2] = "1 x 3 ="; 
r_text[3] = "1 x 4 ="; 
r_text[4] = "1 x 5 ="; 
r_text[5] = "1 x 6 ="; 
r_text[6] = "1 x 7 ="; 
r_text[7] = "1 x 8 ="; 
r_text[8] = "1 x 9 ="; 
r_text[9] = "1 x 10 ="; 
r_text[10] = "1 x 11 ="; 
r_text[11] = "1 x 12 =";; 

var i = Math.floor(12*Math.random()) 

document.write(r_text[i]); 

//--> 
</script></span><input placeholder="=" type="num" /> 
      </li></td> 
    <td><li class="smallfield"><span class="name"><script language="JavaScript"> 
<!-- 
var r_text = new Array(); 
r_text[0] = "1 x 1 ="; 
r_text[1] = "1 x 2 ="; 
r_text[2] = "1 x 3 ="; 
r_text[3] = "1 x 4 ="; 
r_text[4] = "1 x 5 ="; 
r_text[5] = "1 x 6 ="; 
r_text[6] = "1 x 7 ="; 
r_text[7] = "1 x 8 ="; 
r_text[8] = "1 x 9 ="; 
r_text[9] = "1 x 10 ="; 
r_text[10] = "1 x 11 ="; 
r_text[11] = "1 x 12 =";; 

var i = Math.floor(12*Math.random()) 

document.write(r_text[i]); 

//--> 
</script></span><input placeholder="=" type="num" /> 
      </li></td> 

Answer 1

まず、変数に書き込む質問を保存して、後でアクセスできるようにする必要があります。何かのように：

var question = r_text[i]; 
document.write(question); 

このように、後で値を使用することができます。

しかし、これは、検証のために質問文字列から乱数を抽出する必要があることを意味します。より良い方法は、しかし、おそらく単純に生成された乱数（i）を保存し、そう

document.write("1 x " + i + " ="); 

r_text配列の必要性を排除するような質問を書き出すことであろう。

検証のために、入力フィールドの隣にボタンを表示し、onClickイベントを使用して検証メソッドを呼び出すことができます。

<button onClick="javascript:validateAnswer()">Check!</button> 

ここで、validateAnswerは入力フィールドにテキストを取得し、その答えが正しいかどうかを確認します。