Question

我是javascript开发世界的新手，我自己创造了一个小游戏，我父亲的学生可以在学校玩。该游戏由4种不同的数学运算（加法，减法，乘法，除法）组成。学生点击操作按钮后，他们将被转移到新页面。此页面的编号为1到10.此编号将用作静态编号。在用户选择此号码后，他们将有10个不同的问题需要回答。第一个数字是1到12之间的随机数，第二个数字是他们之前在页面上选择的数字。在完成10个问题之后，他们将会看到一个页面，告诉他们他们错过了哪些问题。我已经开始添加部分的代码，但我遇到了几个复杂的问题。

1）如何将答案从一个功能转移到另一个功能？这将用于检查输入。

2）使用switch语句更直观地选择操作＆amp;静态数字？

3）还有其他方法可以促进这个游戏的制作吗？

我想提前感谢你并为长篇大论道歉。我有点失落，很想获得某种反馈。

＆＃13;

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;
}

＆＃13;

<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>

＆＃13;

Answer 1

1）要将数据传输到下一个＆＃34;页面＆＃34;，您可以轻松选择在同一个html文件中为单独的页面分配div。然后，当您需要进入＆＃34;下一页＆＃34;时，只需显示您需要显示的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。它会让你的努力少得多。

希望这有助于编码！

创建一个简单的数学游戏

1 个答案: