2016-10-27 3 views
0

さて、私はリビジョンのために質問のリストからランダムな質問をし、ユーザーが質問に答えたときにテキスト入力を受け取り、それを実際の答えと比較するためのクイズアプリケーションを作成しようとしています。質問。私が使用しているコードは次のとおりです。Math.random()を使用するテキスト入力値と変数値を保存して再利用するにはどうすればよいですか?

var keyList = Object.keys(htmlModule); 
var ranPropName = keyList[ Math.floor(Math.random()*keyList.length) ]; 
var pageStart = function() { 
    document.getElementById("question").innerHTML = htmlModule[ranPropName][0]; 
    document.getElementById("submit").onclick = answerValidation; 
}; 
window.onload = pageStart; 

var answerValidation = function(correctAnswer, userAnswer) { 
    correctAnswer = htmlModule[ranPropName][1]; 
    userAnswer = document.getElementById("submit").value;; 

    if(userAnswer === correctAnswer) { 
    document.getElementById("rightWrong").style.backgroundColor = "green"; 
    } else { 
    document.getElementById("rightWrong").style.backgroundColor = "red"; 
    } 

}; 

変数htmlModule質問とその回答が保存されているオブジェクトを参照します。各質問と回答のペアは、そのプロパティの値である配列内に格納されます。プロパティは単に各ペアを参照するためのキーです。 htmlQ1、htmlQ2など

実際の回答とユーザーの回答を比較したifの文は、trueと評価されません。私はこれを知っているdiv要素の背景色rightWrongは、私が間違いなく正解を入力したときでさえ、赤色に変わるだけなので、緑色に変わるはずです。テキスト入力が何らかの理由で格納されていないか、またはMath.method()の使用のためにMath.random()を使用する変数ranPropNameの値が変更されていると想定されていますが、いずれかの問題を解決する方法が固まっています。すべての返信をお寄せいただきありがとうございます。

+0

いくつかの 'console.log'トラブルシューティングを行います。私は、 'userAnswer'がどのようなものに設定されているかを知ることは有益だろうと思います。 – Santi

+0

とにかくそれらを上書きする場合は、これらの2つの変数をパラメータとして持つことは意味がありません。パラメータリストからそれらを削除し、関数内に2つの 'var'を使用するだけです。 – Bergi

+0

'console.log(userAnswer、correctAnswer、typeof correctAnswer)'を追加し、出力を表示してください。そして 'htmlModule'の例を与えてください。 – Bergi

答えて

0

あなたが説明したように、私はあなたのクイズを視覚化し始めました。

一つのことを変更する必要がされて

は、あなたが、私はおそらくそれは、ボタンタグだと仮定Idをsubmitを持つ要素の値からuserAnswerを取得するということですので、私は次のように作業コードサンプルを書く:

<html> 
    <head> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8"> 
    <title>Title Goes Here</title> 
    </head> 
    <body> 
    <input type="text" id="rightWrong" /> 
    <div id="question" /> 
    <button id="submit">Submit</button> 
    </body> 
    <script> 
    var htmlModule = { 
     'htmlQ1': ['1+1=?', '2'], 
     'htmlQ2': ['2+2=?', '4'] 
    }; 
    var keyList = Object.keys(htmlModule); 
    var ranPropName = keyList[ Math.floor(Math.random()*keyList.length) ]; 
    var pageStart = function() { 
     document.getElementById("question").innerHTML = htmlModule[ranPropName][0]; 
     document.getElementById("submit").onclick = answerValidation; 
    }; 
    window.onload = pageStart; 

    var answerValidation = function(correctAnswer, userAnswer) { 
     correctAnswer = htmlModule[ranPropName][1]; 
     userAnswer = document.getElementById("rightWrong").value; 

     if(userAnswer === correctAnswer) { 
     document.getElementById("rightWrong").style.backgroundColor = "green"; 
     } else { 
     document.getElementById("rightWrong").style.backgroundColor = "red"; 
     } 
    }; 
    </script> 
</html> 

問題が解決しない場合は、htmlを共有してください。

+0

あなたは絶対に正しい - 私はテキスト入力要素ではなく送信ボタンの値にアクセスしていました。あなたの助けに感謝します。 – LoneWanderer20

+0

あなたは大歓迎です!答えが有用なので、投票することができます。 –

+0

私はすでに行っていますが、公式に表示されたポストスコアを変更するには私の評判が低すぎると言いました。私はちょうどアカウントを作ったばかりですが、十分に高い評判を得るために十分に長く留まるなら、私は戻ってきて再びそれを投票します。再度、感謝します! – LoneWanderer20

関連する問題