Question

我是Javascript，HTML和CSS的新手，所以我一直在玩很多新功能，对象，样式，标签等。

我正在研究一些基础数学。功能，并决定尝试创建一个生命系统，以备将来参考，如果我做了一个游戏。

我希望两个按钮一次升高和降低生命变量1。我的两个问题是变量值没有改变onclick，并且消息显示与lives变量不对应，即使在更改值之后也是如此。我认为这是因为在运行lifetest（）函数之后，它会显示必要的消息，但从不检查或再次运行它。

update

Answer 1

是。你是对的。

您正在更新JavaScript中的值，但HTML未更新。

您还必须更新HTML，并且可以通过多种方式完成。

更新HTML onclick
重复检查更改并更新HTML。使用http://www.w3schools.com/jsref/met_win_setinterval.asp
Object.observe - http://www.html5rocks.com/en/tutorials/es7/observe/

Answer 2

你的javascript一团糟，下面我修复了其中的问题

mathstuff = function(){
var x = Math.floor((Math.random() * 10) + 1);
document.getElementById("demo").innerHTML = x;
}
mathstuff2 = function() {
var x = Math.random();
document.getElementById("demo2").innerHTML = x;
}
onetoten = function() {
var x, text;
//get the value of input with id "numb"
x = document.getElementById("numb").value;

//if x is not a number or is less than one or greater than 10
if (isNaN(x) || x < 1 || x > 10){
    text="Not A Valid Input";
}
else {
    text="A Valid Input";
}

document.getElementById("displayonetoten").innerHTML=x+" is "+text;
}


//function gainloselife(){

var lives = 1;
//increase/decrease lives
gainlife = function(){
lives++;
    lifetest();
}

loselife = function(){
lives--;
    lifetest();
}
//lives testing
lifetest = function(){ 
var message;
if (isNaN(lives) || lives < 0){
//endgame();
message="You are out of lives. Better luck next time. Press Restart to try again.";
}
else {
message="You have at least a life left";
}
    document.getElementById("endingmessage").innerHTML=message;
    document.getElementById('livestext').innerHTML=lives;
}

lifetest();

这是一个有效的jsfiddle http://jsfiddle.net/ajaaibu/2b4s8gmf/

需要帮助更改变量值然后更改显示的消息

2 个答案: