Javascript颜色游戏



我已经在互联网上寻找解决方案,但我不确定为什么这不会出现在浏览器中。它可以在javascript的repl中工作,但由于某种原因,它不会在我的谷歌浏览器中打开。

<script>function numbergame() {
	colors = ["Red", "Green", "Blue", "Orange", "Yellow", "Indigo", "Violet", "Gray", "Black", "White"]
	var random_color = colors[Math.round(Math.random()*colors.length)]
	var guesses = 0;
	var thecolor = false;
	var playerguess;
	while (!thenumber) {
	playerguess = prompt("I am thinking of a number color from this list:n" +color +"nCan you guess which one it is?");
	guesses+=1;
	thenumber = checkguess()
};
function checkguess() {
		if (!colors.include(playerguess)) {alert("Please enter a valid color"); return false}
		if (playerguess<random_color) {alert("Hint: the answer is lower alphabetically.");return false}
		if (playerguess>random_color) {alert("Hint: the answer is higher alphabetically.");return false}
		else {alert("You've guessed the color! It was " + random_number+" and it took you " + guesses+ " tries.");
		myBody=document.getElementsByTagName("body")[0];
		myBody.style.background=thecolor;
		return true;}
}</script>
<!doctype html>
<html>
<head>
	Color Game.
</head>
<body onload= "numbergame()"></body>
</html>

没有右大括号来匹配行上的大括号:

while (!thenumber) {

使用正确的缩进和格式将使此类错误更容易找到。

你写的不是有效的 HTML。

您的<script>标签必须放置在 HTML 文档的<body><head>中,而不是放在文档类型之前的开头。

这个HTML文件有很多问题。我已经纠正了这些问题,但即使修复了,它的编码仍然很糟糕。但是,这里是...

<!DOCTYPE html>
<html>
<head>
<script>
'use strict';
function numbergame() {
    var colors = ["Red", "Green", "Blue", "Orange", "Yellow", "Indigo", "Violet", "Gray", "Black", "White"];
    var random_color = colors[Math.round(Math.random()*colors.length)];
    var guesses = 0;
    var thecolor = false;
    var playerguess;
    var thenumber = false;
    while (!thenumber) {
        playerguess = prompt("I am thinking of a number color from this list:n" + colors + "nCan you guess which one it is?");
        guesses += 1;
        thenumber = checkguess(colors, playerguess, random_color, guesses);
    }
};
function checkguess(colors, playerguess, random_color, guesses) {
        if (!colors.includes(playerguess)) {
            alert("Please enter a valid color"); return false
        }
        if (playerguess < random_color) {
            alert("Hint: the answer is lower alphabetically.");
            return false;
        }
        if (playerguess > random_color) {
            alert("Hint: the answer is higher alphabetically.");
            return false;
        } else {
            alert("You've guessed the color! It was " + random_color + " and it took you " + guesses + " tries.");
            var myBody = document.getElementsByTagName("body")[0];
            myBody.style.background = random_color;
            return true;
        }
}
</script>
</head>
<body onload="numbergame()">
<h1>Color Game</h1>
</body>
</html>

这些问题是未声明的变量、缺少大括号、范围问题、错误位置的<script>标签等。老实说,你最好自己从头开始编码。

我在火狐 47.0.1 上对此进行了测试。您可能会遇到其他浏览器兼容性问题,但我相信您可以从这里自己解决这些问题:)

数字游戏函数中的while循环应如下所示:

while (!thenumber) {
    playerguess = prompt("I am thinking of a number color from this list:n" +color +"nCan you guess which one it is?");
    guesses+=1;
    thenumber = checkguess();
} // <-- this curly brace was missing

最新更新