我正在尝试创建一个简单的加法测验,其中用户将两个数字相加,然后按“提交”,然后出现下一个问题。 我试图使用数组来解决问题,因为我将不得不(最终)存储用户的答案并将它们与正确答案进行比较。 但就目前而言,我很高兴能在用户按下“提交”时显示下一个问题。

http://jsfiddle.net/ZwwLh/4

HTML:

<form>
<table id="addProblem" width="150" border="0" cellspacing="0" cellpadding="10">
  <tr>
    <td>&nbsp;</td>
    <td colspan="1" align="right"><input id="carryOver"></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td colspan="2" align="right" id="firstNum">48</td>
  </tr>
  <tr>
    <td>+</td>
    <td colspan="2" align="right" id="secondNum">16</td>
  </tr>
  <tr>
    <td colspan="3"><hr id="sepLine"></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td colspan="2" align="right"><input id="userAnswer" type="text"></td>
  </tr>
  <tr>
    <td colspan="3"><button onclick="checkAnswer()">Submit</button></td>
  </tr>
</table>
    </form>

JavaScript:

var numOne = [48,39,16,43,37,23,44,13,37,28,48,16];    // first number in addition problem
var numTwo = [16,22,25,18,46,49,18,39,25,17,9,28];     // second number in addition problem

var i = 0;

function checkAnswer() {
    // assigns guessed number to variable
    var guess = Number(document.getElementById('userAnswer').value);

    if (guess == numOne[i]+numTwo[i]) {
        if(confirm("Correct!")) {
            // next question
            i++;
            document.getElementById('firstNum').innerHTML=numOne[i];
            document.getElementById('secondNum').innerHTML=numTwo[i];
        }
    } else {
        if(confirm("Incorrect")) {
            // next question
            i++;
            document.getElementById('firstNum').innerHTML=numOne[i];
            document.getElementById('secondNum').innerHTML=numTwo[i];           
        }
    }
}

===============>>#1 票数:0 已采纳

getElementById将字符串作为参数,因此您需要这样做:

document.getElementById('numOne').innerHTML=numOne[i]; //notice the single quotes around numOne

您可能想重命名numOne和numTwo变量,因为它们可能会使您与用于TD的ID混淆。

===============>>#2 票数:0

    var numOne = [48, 39, 16, 43, 37, 23, 44, 13, 37, 28, 48, 16];
    var numTwo = [16, 22, 25, 18, 46, 49, 18, 39, 25, 17, 9, 28];
    var i = 0;

    window.onload = function () {
        a = document.getElementById('firstNum').innerHTML = numOne[i];
        b = document.getElementById('secondNum').innerHTML = numTwo[i];
        i++;
    }
    function clicked() {
        var c = a + b;
        var guess = document.getElementById('userAnswer').value;
        if (guess == c) {
            alert('correct');
        }
        else {
            alert('incorrect');
        }
        a = document.getElementById('firstNum').innerHTML = numOne[i];
        b = document.getElementById('secondNum').innerHTML = numTwo[i];
        i++;
    }


<form>
    <table id="addProblem" width="150" border="0" cellspacing="0" cellpadding="10">
        <tr>
            <td></td>
            <td colspan="2" align="right" id="firstNum"></td>
        </tr>
        <tr>
            <td>+</td>
            <td colspan="2" align="right" id="secondNum"></td>
        </tr>
        <tr>
            <td colspan="3">
                <hr id="sepLine">
            </td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td colspan="2" align="right">
                <input type="text" id="userAnswer" />
            </td>
        </tr>
        <tr>
            <td colspan="3">
                <input type="button" onclick="clicked();" value="Submit"/>
            </td>
        </tr>
    </table>
</form>

或者您可以使用多维数组

    //var numOne = [48, 39, 16, 43, 37, 23, 44, 13, 37, 28, 48, 16];
    //var numTwo = [16, 22, 25, 18, 46, 49, 18, 39, 25, 17, 9, 28];
    score = 0;
    var md = [
        [48, 16],
        [39, 22],
        [16, 25],
        [43, 18],
        [37, 46],
        [23, 49],
        [44, 18],
        [13, 39],
        [37, 25],
        [28, 17],
        [48, 9],
        [16, 28],
    ];
    var i = 0;
    var j = 1;
    var z = 0;
    window.onload = function () {
        a = document.getElementById('firstNum').innerHTML = md[i][i];
        b = document.getElementById('secondNum').innerHTML = md[i][j];
        i++;
    }
    function clicked() {
        var c = a + b;
        var guess = document.getElementById('userAnswer').value;
        if (guess == c) {
            alert('correct');
            score++;
            document.getElementById('score').innerHTML = 'Number right: ' + score;
        }
        else {
            alert('incorrect');
        }
        a = document.getElementById('firstNum').innerHTML = md[i][z];
        b = document.getElementById('secondNum').innerHTML = md[i][j];
        i++;
    }

  ask by lindsey translate from so

未解决问题?本站智能推荐:

1回复

document.getElementById带有循环和本地与全局变量

每当我尝试使用时,需要一些帮助 取代 在我的循环中,它不起作用。 不知道为什么,我相信我弄乱了名字和<br>但是当它刚child123[i];时它仍然没有打印出来child123[i]; 在我的代码中,是否有更好的方法将merger()和sorter()放到我
2回复

javascript中的document.getElementById循环

我在html中有两个标签。 在第一个选项卡中,我有一些选项,例如textarea,选项列表,复选框...当我单击“确定”时,我希望我的应用将我选择的内容(在第一个选项卡中)显示/传输为第二个选项卡作为文本。 ”按钮。 在js脚本中,我添加了以下功能: 结果显示在第二个选项卡中,如
4回复

对于循环和getElementById

希望这很简单,但是我在将for循环中的数字系列打印回到HTML时遇到了麻烦。 参见下面的代码,当我按下按钮时,它只会返回10,而不是其余的数字-我在哪里出错?
5回复

For循环中的getElementById

我正在使用For循环来运行数组并返回相关的字符串。 当我使用getElementById时,我只得到最后一个字符串,但如果我使用document.write,一切都很好。 并且HTML是<p id="namelist">list of names go here</p
1回复

通过jquery函数循环,结果在循环外处理

刚刚在jsfiddle中找到了一些有趣的代码,并试图循环并在一次运行中获得多个比赛/团队数据。 我想多次(循环)请求以下Feed: 完整的代码在这里(不是我的,顺便说一句): https : //jsfiddle.net/t4ywc8vt/10/ 我已经尝试过多次for循环调
4回复

如何无限循环jQuery画廊

我使用jQuery创建了一个图像幻灯片,其中5个图像在25秒的间隔内一个接一个地出现。 每个图像在淡出之前保持5秒钟,然后下一个图像淡入。 幻灯片放映工作正常,但我希望它永远循环 , 即在最后一个图像淡出后,它应该从第一个图像重新开始动画 。 我尝试使用setInterval但无法成功
8回复

在jsfiddle中取消无限循环执行

当您在Chrome中的jsfiddle中获得无限循环时,您唯一的选择(我知道)是关闭选项卡。 当然,这意味着您在当前窗口中丢失了所有工作! 是否有一种简单的方法可以阻止无限执行的脚本? 我打开了开发人员工具,因为我正在做一些调试。 我能够暂停脚本并逐步完成循环。 我
2回复

在继续循环之前完成运行功能

我希望FOR循环中的函数在继续执行下一个代码之前完成运行,但是我无法使其正常工作。 在弹出警报窗口“ Lucky you”之前,它应该淡入淡出文本“ Result”,但是在看到文本之前,我会先看到警报窗口循环。 我不知道我在做什么错。
1回复

window.open打开无限打开循环

我正在尝试通过以下方式打开新窗口: 但会造成无限循环,并再次重新打开网页。 我不知道代码有什么问题。 完整的代码在Fiddle中: https : //jsfiddle.net/gbPGb/196/
2回复

jQuery循环生成的垂直对齐复选框

如何获得复选框以垂直对齐? 这是JSFIDDLE 。 我想要 这似乎很简单,但是我尝试了"vertical-align:middle;" 在几个位置。 理想情况下,我想在此处设置对齐方式: 谢谢。