Question

我正在创建一个带有文本字段的交互式应用程序来练习javascript，但我发现要验证，虽然函数的其余部分循环但是情况不会显示innerHTML文本。 text.innerHTML适用于所有其他情况，我在这里遗漏了什么吗？

的Javascript

function getNum(input){
    if (isNaN(input)) {
        oldstate = state-1;
        state = 33;
        console.log("Loading error Message...");
        act();
    }
    else{return(parseInt(input, 10));}
}

function act(){
    console.log("Case: "+state);
    input = inputf.value;
    inputf.value="";
    switch(state){
        case 0:
            name = input;
            text.innerHTML = "Well, hello there, "+name+"! Nice to meet you. What's your age?";
            break;
        case 1:
            text.innerHTML = "Loading...";
            age = getNum(input);
            text.innerHTML = "So, "+name+" you are "+age+" years old!";
            break;
        case 33:
            text.innerHTML = "That is NOT a number! Hit Submit to Return.";
            console.log("Error Successfully loaded!");
            state = oldstate;
            break;
    }
    state=+1;
}


function getStr(input){

}

这是我的HTML文本字段ID。任何优化建议也将不胜感激。

HTML

<!DOCTYPE html>
<html>
    <head>
        <title>titles are lame</title>
        <link/>
        <link rel="stylesheet" type="text/css" href="stylesheet.css">
        <script type="text/javascript" src="script.js"></script>
        <script></script>
    </head>
    <body>
<div id="wrapper"><div id="text">First, let's have your name.</div>
    <br>
    <input type='text' id="input"><input type="submit"id="submit" onclick="act()">

</div>
    <script>
    var state = 0;
    var inputf = document.getElementById("input");
    var text = document.getElementById('text');
    var input, name, age,oldstate;

    document.getElementById("input").addEventListener("keydown", function(e) {

    // Enter is pressed
    if (e.keyCode == 13) { act(); }
}, false);
    </script>
    </body>
</html>

Answer 1

我想我知道问题所在。在案例1中，您调用getNum方法，它在正确的情况下执行得很好，调用act()方法，正确输入案例33，返回错误并且......然后继续执行案例1。因为在getNum函数的第一种情况下未指定return语句，所以age具有未定义的值。如果添加以下行，它应该可以正常工作：

if (!age) return;

在案例1中调用getNum方法之后。

编辑：我刚刚意识到你还应该在检测到错误后检查状态是如何管理的。添加我给你的行将保持33状态。

Answer 2

点击here查看答案..

 act() //Changed

innerHTML在案例上失败

2 个答案: