HTML - 私はランダムに画面上の写真を示すコードを持つランダムな数学の方程式

のための正しい答えをチェック：HTML - 私はランダムに画面上の写真を示すコードを持つランダムな数学の方程式

<html> 
<head> 
<title>Test</title> 

<script type="text/javascript"> 
    var imageURLs = [ 
     "www._.com/test.jpg" 
    , "www._.com/test.jpg" 
    , "www._.com/test.jpg" 
    ]; 
    function getImageTag() { 
    var img = '<img src=\"'; 
    var randomIndex = Math.floor(Math.random() * imageURLs.length); 
    img += imageURLs[randomIndex]; 
    img += '\" alt=\"Some alt text\"/>'; 
    return img; 

    } 
</script> 


</head> 
<body> 
<script type="text/javascript"> 
    document.write(getImageTag()); 
</script> 
</body> 
</html>

各画像は、数学の問題です。どのようにして各写真に別の解決策を割り当て、表示された画像に応じて入力が一致するかどうかを確認する入力ボックスを配置しますか？

出典

2017-04-17 George Tsereteli

あなたはこのようにそれを試すことができます。..

<html> 
<head> 
<title>Test</title> 

<script type="text/javascript"> 
    var imageURLs = [ 
    "1.png" 
    , "2.png" 
    , "3.png" 
    ]; 
    var answer = [ // create the answer array 
    "brown" 
    , "blue" 
    , "green" 
    ]; 
    // make randomIndex global 
    var randomIndex = Math.floor(Math.random() * imageURLs.length); 

    // set image based on randomIndex 
    function getImageTag() { 
    var img = '<img src=\"'; 
    img += imageURLs[randomIndex]; 
    img += '\" alt=\"Some alt text\"/>'; 
    return img; 
    } 

    // check answer based on randomIndex 
    function checkAnswer() { 
    var ans = document.getElementById("in").value; 
    if(ans == answer[randomIndex]) 
    alert("Hooray!"); 
    else 
    alert("Try again"); 
    } 
</script> 


</head> 
<body> 
    <script type="text/javascript"> 
     document.write(getImageTag()); 
    </script> 
    <br> 
     <input type="text" id="in"/> 
     <!-- Call checkAnswer() to verify--> 
     <input type="submit" value="Go" onclick="checkAnswer()"/> 
</body> 
</html>

メインコンセプトは次のように..です

それは我々がランダムインデックスがグローバルにする以外は、イメージを作成しているのと同じ方法です変数
グローバルアレイに格納されているランダムインデックスに基づいてイメージを選択しています。同様に、グローバルアレイ内の同じ方法で以前にも格納されたインデックスに基づいて回答を選択します。
ユーザーが答えを出すたびに、前の概念を使用して確認しています。

これは私が行ったことを明確にします。まだ混乱がある場合はコメントしてください。

出典

2017-04-17 05:57:03 lU5er

ありがとうございます！これは本当に役に立ちました –

@GeorgeTsereteliそれでは、これを受け入れることができますか？ – lU5er

HTML - 私はランダムに画面上の写真を示すコードを持つランダムな数学の方程式

答えて

関連する問題