innerHTML失败案例
问题描述:
我正在制作一个带有文本字段的交互式应用程序来练习JavaScript,但是我发现要进行验证,尽管该函数的其余部分循环,但该案例不显示innerHTML文本。 text.innerHTML适用于所有其他情况,我是否在这里丢失了某些东西?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>
答
我想我知道是什么问题。在情况1中,您调用getNum
方法,它在正确的情况下执行得很好,调用act()
方法,正确输入个案33,返回一个错误,然后...继续执行第1种情况。因为您没有指定返回在getNum
函数的第一种情况下的陈述,age有一个未定义的值。如果你加入这一行应该很好地工作:
if (!age) return;
只是调用getNum
方法的情况下,经过1
编辑:我只是意识到,你也应该检查检测到错误后如何状态管理。添加我给你将离开的33
如果你按下了'enter'它将工作...所以是什么问题? – lolo 2013-03-22 15:17:58
对于我来说,“这不是一个数字”错误不会显示,如果你调试,并没有提供一个数值时,要求年龄。它反而会反弹,并说你是不确定的岁。它应该会抛出一个错误。 – Signify 2013-03-22 15:19:35