創建一個簡單的數學遊戲

我是JavaScript新興的發展中國家，我自己創建了一個小型遊戲，我的父親學生將能夠在學校中玩。這個遊戲包含4個不同的數學運算（加法，減法，乘法，除法）。一旦學生點擊操作按鈕，他們將被轉移到一個新的頁面。此頁面將具有1到10之間的數字。此號碼將用作靜態號碼。用戶選擇此號碼後，他們將有10個不同的問題需要回答。第一個數字是從1到12的隨機數字，第二個數字是他們之前在頁面上選擇的數字。完成10個問題後，他們將會看到一個頁面，告訴他們錯過了哪些問題。我已經開始了添加部分的代碼，但是我遇到了一些困難。創建一個簡單的數學遊戲

1）我如何將答案從一個函數轉移到另一個函數？這將用於檢查輸入。

2）使用switch語句來選擇操作&的靜態數字會更直觀嗎？

3）有沒有其他方法可以幫助製作這款遊戲？

我想事先感謝您，併爲長期職位道歉。我有點失落，很想得到某種反饋。

var x; 
 

 
function startAdd() { 
 

 
    var random = new Array(); 
 
    for (var i = 0; i < 1; i++) { 
 

 
    random.push(Math.floor(Math.random() * 13)); 
 
    // console.log(random[i]); 
 
    } 
 

 
    var allRadioButtons = document.getElementsByName("dif"); 
 
    var secondNumber; 
 

 
    for (var i in allRadioButtons) { 
 
    if (allRadioButtons[i].checked) { 
 
     secondNumber = +allRadioButtons[i].value; 
 
     break; 
 
    } 
 
    } 
 

 
    for (var a = 0; a < 1; a++) { 
 

 
    document.getElementById('probFirst').innerHTML = random[a]; 
 
    document.getElementById('probSecond').innerHTML = secondNumber; 
 

 

 
    /* 
 
       compareUser(); 
 
       function compareUser(){ 
 

 
       if (prob !=) 
 
       } */ 
 

 

 
    } 
 
} 
 

 
function myFunction() { 
 
    var x = document.getElementById("userNumb").value; 
 
    document.getElementById("Answer").innerHTML = x; 
 
}

<title>RicoMath - Addition</title> 
 

 
<body> 
 
    <h1>RicoMath</h1> 
 
    <h1 class="add">Addition</h1> 
 
    <h2>Difficulty</h2> 
 
    <div id="options"> 
 
    <div> 
 
     <input id="num1" type="radio" name="dif" value="1"> 
 
     <label for="num1">1</label> 
 
    </div> 
 
    <div> 
 
     <input id="num2" type="radio" name="dif" value="2"> 
 
     <label for="num2">2</label> 
 
    </div> 
 
    <div> 
 
     <input id="num3" type="radio" name="dif" value="3" checked> 
 
     <label for="num3">3</label> 
 
    </div> 
 
    <div> 
 
     <input id="num4" type="radio" name="dif" value="4"> 
 
     <label for="num4">4</label> 
 
    </div> 
 
    <div> 
 
     <input id="num5" type="radio" name="dif" value="5"> 
 
     <label for="num5">5</label> 
 
    </div> 
 
    <button onclick="startAdd()">Begin!!!!</button> 
 
    <h4 id='probFirst'></h4> 
 
    <h4 id='probSecond'></h4> 
 
    </div> 
 
    <input type="number" id="userNumb" value=""> 
 
    <button onclick='myFunction()'>Enter UserNumb</button> 
 
    <p id="Answer"></p> 
 
</body>

來源

2017-07-20 John Salazar

你想將結果轉移到新的html頁面或同一頁面嗎？另外你在文中說，你會首先要求用戶從4種類型的動作中進行選擇，但是片段要求從5個數字中進行選擇？ –

@toing_toing我希望將結果轉移到其他頁面。我已經爲操作創建了按鈕。在開始下一步工作之前，我正在專注於創建一個工作操作。爲了測試目的，我最多創建了5個數字。感謝您的快速響應！ –

1）將數據傳輸到你的下一個「頁」，爲您輕鬆選擇是對在同一個HTML文件中單獨的頁面單獨的div。然後，當你需要去「下一頁」時，只需顯示你需要顯示的div並隱藏其他頁面。

下面是與工作例的HTML +純JavaScript代碼：

<body> 
<div id="page1" style="border-width:2px;border-style:solid"> 
your first page 
<button onclick="showPage2()">Go to Page 2</button> 
</div> 
<div id="page2" style="border-width:2px;border-style:solid"> 
2nd page 
</div> 
<div id="page3"> 
3rd page 
</div> 
<script> 
showPage1(); 
function hide(id){ 
     document.getElementById(id).hidden = true; 
    } 
    function show(id){ 
     document.getElementById(id).hidden = false; 
    } 

    function showPage1(){ 
    show("page1"); 
    hide("page2"); 
    hide("page3"); 
    } 

    function showPage2(){ 
    show("page2"); 
    hide("page1"); 
    hide("page3"); 
    } 
</script> 
</body>

這裏有一個working fiddle.

從輸入轉發你的價值，只是用document.getElementById()，因爲你是在同html文件。

2）要想從單選按鈕列表中選定的值，只需使用（根據您的代碼）：

var rates = document.getElementById('options').value;

您可以用同樣的方法來獲得從輸入框中的值。請確保您添加了一個空輸入檢查，並檢查是否在獲取該值之前選擇了單選按鈕。

我沒有看到任何需要循環，因爲你已經完成。

3）肯定學習和使用jquery。它會讓你的努力少得多。

希望這有助於和快樂的編碼！

來源

2017-07-20 04:55:25

創建一個簡單的數學遊戲

回答

相關問題