Javascript 如何使我的猜测功能在我的猜测数字游戏中工作？

我正在用HTML、CSS和javascript做一个猜数字游戏。我似乎不知道我的javascript有什么问题。我尝试了很多方法来让它工作，但我想不出来。我现在唯一要做的就是简单游戏模式。其中一些会起作用，但“猜测”按钮不会起作用。这是我的密码：

function-easy（）{
var easyNum=Math.floor（Math.random（）*6）；
document.getElementById（'menu'）.innerHTML=“猜一个介于1和5之间的数字”


猜一猜！”；
}
函数{
if（document.getElementById（'easyDiv'）。value==easyNum）{
document.getElementById（'menu'）.innerHTML=“这是正确的！”；
}否则{
document.getElementById（'menu'）.innerHTML=“这是不正确的。数字是“+easyNum+”；
}
}

*{
边际：0px；
}
#猜{
填充物：5px；
边框颜色：#C3C3；
背景：#C3C3；
}
输入{
边框：0.5px实心#000000；
边界半径：5px；
大纲：无；
背景：#D4；
}
钮扣{
边框：实心；
边框颜色：#000000；
边界半径：7.5px；
填充：7.5px；
大纲：无；
光标：指针；
}
#轻松的{
背景：#00ff00；
}
#中等{
背景#ffff00；
}
#硬的{
背景：#ff6600；
}
#疯狂的{
背景：#ff0000；
}
#菜单{
边界半径：10px；
文本对齐：居中；
位置：绝对位置；
转换：翻译（-50%，-50%）；
最高：50%；
左：50%；
填充：25px；
背景：#ffffff；
不透明度：0.9；
字体系列：arial；
}
#标题{
背景色：#ffffff；
不透明度：0.7；
宽度：100%；
高度：120px；
位置：相对位置；
}
#头衔{
字体系列：arial；
位置：绝对位置；
转换：翻译（-50%，-50%）；
最高：50%；
左：50%；
}
身体{
背景：径向梯度（#aaaaff，#00003b）无重复中心；
背景大小：100%100%；
}

猜猜数字
猜猜数字
水平选择


容易的
中等
硬的
疯狂的

easyNum

仅存在于创建它的功能块中。您需要将其设置为全局变量，以便

guestEasy（）

可以访问它，或者将其作为参数传递给

guestEasy（）

，如下所示：

"<div ... onclick='guessEasy(" + easyNum + ")' ...></div>"

*{
边际：0px；
}
#猜{
填充物：5px；
边框颜色：#C3C3；
背景：#C3C3；
}
输入{
边框：0.5px实心#000000；
边界半径：5px；
大纲：无；
背景：#D4；
}
钮扣{
边框：实心；
边框颜色：#000000；
边界半径：7.5px；
填充：7.5px；
大纲：无；
光标：指针；
}
#轻松的{
背景：#00ff00；
}
#中等{
背景#ffff00；
}
#硬的{
背景：#ff6600；
}
#疯狂的{
背景：#ff0000；
}
#菜单{
边界半径：10px；
文本对齐：居中；
位置：绝对位置；
转换：翻译（-50%，-50%）；
最高：50%；
左：50%；
填充：25px；
背景：#ffffff；
不透明度：0.9；
字体系列：arial；
}
#标题{
背景色：#ffffff；
不透明度：0.7；
宽度：100%；
高度：120px；
位置：相对位置；
}
#头衔{
字体系列：arial；
位置：绝对位置；
转换：翻译（-50%，-50%）；
最高：50%；
左：50%；
}
身体{
背景：径向梯度（#aaaaff，#00003b）无重复中心；
背景大小：100%100%；
}

猜猜数字
猜猜数字
水平选择


容易的
中等
硬的
疯狂的

您需要输入

var easyNum在函数外部，以便全局使用

var easyNum;

function easy() {
  easyNum = Math.floor(Math.random() * 6);
  document.getElementById('menu').innerHTML = "<div id='easyDiv'><p>Guess a number between 1 and 5</p><br><input id='easyGuess'><br><br><button id='guess' onclick='guessEasy()'>Guess!</button></div>";
}

function guessEasy() {
  if (document.getElementById('easyDiv').value == easyNum) {
    document.getElementById('menu').innerHTML = "<h2>That is correct!</h2>";
  } else {
    document.getElementById('menu').innerHTML = "<h2>That is incorrect.</h2><h2>The number was" + easyNum + ".</h2>";
  }
}

var easyNum；
函数easy（）{
easyNum=Math.floor（Math.random（）*6）；
document.getElementById（'menu'）.innerHTML=“猜一个介于1和5之间的数字”


猜一猜！”；
}
函数{
if（document.getElementById（'easyDiv'）。value==easyNum）{
document.getElementById（'menu'）.innerHTML=“这是正确的！”；
}否则{
document.getElementById（'menu'）.innerHTML=“这是不正确的。数字是“+easyNum+”；
}
}
您需要在函数外部声明“easyNum”变量。像这样：


var easyNum；
函数easy（）{
easyNum=Math.floor（Math.random（）*6）；
document.getElementById（'menu'）.innerHTML=“猜一个介于1和5之间的数字”


猜一猜！”；
}
函数{
if（document.getElementById（'easyDiv'）。value==easyNum）{
document.getElementById（'menu'）.innerHTML=“这是正确的！”；
}否则{
document.getElementById（'menu'）.innerHTML=“这是不正确的。数字是“+easyNum+”；
}
}
*{
边际：0px；
}
#猜{
填充物：5px；
边框颜色：#C3C3；
背景：#C3C3；
}
输入{
边框：0.5px实心#000000；
边界半径：5px；
大纲：无；
背景：#D4；
}
钮扣{
边框：实心；
边框颜色：#000000；
边界半径：7.5px；
填充：7.5px；
大纲：无；
光标：指针；
}
#轻松的{
背景：#00ff00；
}
#中等{
背景#ffff00；
}
#硬的{
背景：#ff6600；
}
#疯狂的{
背景：#ff0000；
}
#菜单{
边界半径：10px；
文本对齐：居中；
位置：绝对位置；
转换：翻译（-50%，-50%）；
最高：50%；
左：50%；
填充：25px；
背景：#ffffff；
不透明度：0.9；
字体系列：arial；
}
#标题{
背景色：#ffffff；
不透明度：0.7；
宽度：100%；
高度：120px；
位置：相对位置；
}
#头衔{
字体系列：arial；
位置：绝对位置；
转换：翻译（-50%，-50%）；
最高：50%；
左：50%；
}
身体{
背景：径向梯度（#aaaaff，#00003b）无重复中心；
背景大小：100%100%；
}

猜猜数字
猜猜数字
水平选择


容易的
中等
硬的
疯狂的
您的代码中有两个问题：


在
easyGuess
函数中，您可以检查easyDiv值
document.getElementById（'easyDiv'）。value==easyNum
，但实际上您希望像这样检查easyGuess值：
docum
var easyNum; //change 1

function easy() {
  easyNum = Math.floor(Math.random() * 6);
  document.getElementById('menu').innerHTML = "<div id='easyDiv'><p>Guess a number between 1 and 5</p><br><input id='easyGuess'><br><br><button id='guess' onclick='guessEasy()'>Guess!</button></div>";
}

function guessEasy() {
  if (document.getElementById('easyGuess').value == easyNum) { //change 2
    document.getElementById('menu').innerHTML = "<h2>That is correct!</h2>";
  } else {
    document.getElementById('menu').innerHTML = "<h2>That is incorrect.</h2><h2>The number was" + easyNum + ".</h2>";
  }
}