.innerHTML不在Javascript中更新HTML

时间:2014-04-23 23:57:55

标签: javascript

在岩石剪刀分配上工作,其中全局变量根据计算机或人类获胜而递增。我的功能正常,但使用.innerHTML时记分板不会更新。有什么建议吗?

document.getElementById("humanScore").innerHTML = humanTotal;
document.getElementById("computerScore").innerHTML = compTotal;

http://codepen.io/anon/pen/GvpaJ

3 个答案:

答案 0 :(得分:2)

您遇到了一些问题。

在你的游戏功能中,你没有对computerChoice变量做任何事情,它应该是对compPlay()的函数调用的结果。目前它是var computerChoice = compPlay,它实际上是将computerChoice分配给一个函数,而不是它的结果。

其次在测试if语句时,你再次检查值compPlay,这是一个函数,我认为它应该是computerChoice

第三。 compPlay的返回值是一个索引,它应该来自compOptions数组的索引值

更新以下代码

var humanTotal =0;                                          
var compTotal=0;                                    

document.getElementById("rock").onclick = setRock;
document.getElementById("paper").onclick = setPaper;
document.getElementById("scissors").onclick = setScissors;

function setRock(){
    play("rock")
}

function setPaper(){
    play("paper")
}

function setScissors(){
    play("scissors")
}    

function play(humanChoice) {    
    var computerChoice = compPlay(); //<-- Change Here

    //And all the following if statements to check the computer choice
    if (humanChoice == "rock"){
        if (computerChoice  =="rock"){
        } else if (computerChoice =="scissors"){
            humanTotal++; 
        } else if (computerChoice =="paper"){
            compTotal++;
        }
    }

    if (humanChoice == "paper"){
        if (computerChoice  =="paper"){
        } else if (computerChoice =="rock"){
            humanTotal++; 
        } else if (computerChoice =="scissors"){
        compTotal++;
        }
    }

    if (humanChoice == "scissors"){
        if (computerChoice  =="scissors"){
        } else if (computerChoice =="paper"){
            humanTotal++; 
        } else if (computerChoice =="rock"){
            compTotal++;
        }
    }

    document.getElementById("humanScore").innerHTML = humanTotal;
    document.getElementById("computerScore").innerHTML = compTotal;

}   


function compPlay (){
    var compOptions = ['rock', 'paper', 'scissors'];    
    var randomChoice = Math.floor(Math.random()*compOptions.length);
    return compOptions[randomChoice]; //<-- Change Here

}

它与innerHTML无关,工作正常,只是得分始终为零。原因是因为没有一个if语句测试&#34;摇滚&#34;,&#34;论文&#34;或&#34;剪刀&#34;因为计算机选择永远不会匹配&#34;摇滚&#34;,#34;纸张#34;或者#34;剪刀&#34;,所以很高兴,因为这是你的功能。

答案 1 :(得分:1)

您的功能无法正常使用。 innerHTML - 部分的工作方式应该如此(证明:http://codepen.io/anon/pen/qlIsG)。

问题是你在游戏逻辑中犯了一些错误,导致记分牌每次都以0-0结束。

祝你好运。

答案 2 :(得分:1)

你有几个错误,它不是innerHTML的问题:

1)更改此项,并使用computerChoice检查计算机播放

 var computerChoice = compPlay();

2)在compPlay功能中,更改此内容:

return compOptions[randomChoice]; // you want the play, not the random number

工作版:

http://codepen.io/juvian/pen/pLqxD