将属性值与随机数进行比较（JavaScript/jQuery）

我在比较属性值和随机数（在单独的函数中创建）时遇到问题。 在我的html中，在一个周围的div中有几个div。 周围元素中的每个div都有一个名为“value”的属性，第一个包含值1，第二个包含值2。。。 像这样：

      <div id="Stage_placeholder_rectangles">
        <div id="Stage_placeholder_rectangles_red" value=0 width=25 height=25/>
        <div id="Stage_placeholder_rectangles_pink" value=1 width=25 height=25/>
        <div id="Stage_placeholder_rectangles_orange" value=2 width=25 height=25/>
        ...
      </div>

在我的函数checkColor中，我想将随机数与存储在“占位符\矩形\橙色”、“占位符\矩形\红色”属性值中的值进行比较。。。 这是我的职责：

function checkColor(rnd){
    if(gameStarted){
        $("#Stage_placeholder_rectangles").click(function(e){
            if($("#"+e.target.id).attr("value") == rnd){
                console.log("right");
            }
            else if($("#"+e.target.id).attr("value") != rnd){
            console.log("false");
            gameOver = true;
            }
        });
    }
}

我的问题是，当我选择正确的元素（在其属性“value”中的值与随机数相同的元素）时，我在控制台中得到：

---

“正确”和多次“错误”，即使我的属性值和随机数相同。

我认为您的部分问题是使用

rnd

，这在前面没有定义，但我们没有您的所有代码

这就是它的工作原理：

<div>Please click the colour: <span id="name"></span></div>
<p/>
<div id="Stage_placeholder_rectangles">
    <div id="Stage_placeholder_rectangles_red" class="square red" value=0 width="25" height="25"></div>
    <div id="Stage_placeholder_rectangles_pink" class="square pink" value=1 width="25" height="25"></div>
    <div id="Stage_placeholder_rectangles_orange" class="square orange" value=2 width=25 height="25"></div>
 </div>
<p/>
<div id="result"></div>

还有很多东西可以使用数组和jquery简化，但我暂时不做了

---

功能齐全的jsfiddle at

我不明白你在这里做什么。如果游戏启动，那么它会在周围的

div

上设置一个

点击
处理程序，但是
checkColor（）
只能从
randomColors（）中调用
，它被称为…什么时候？你能更好地描述一下你想要的行为吗？这是一个游戏，你必须点击矩形，它的颜色与屏幕上显示的文本相对应。每个矩形都有一个值属性，值为：0,1,2，…带有颜色名称的不同文本，根据n一个随机数。这个随机数与矩形值相对应。因此，文本红色与数字0一起出现，红色矩形的值也为0。现在我想在函数中比较随机数属性中的值。以检查它们是否匹配。但当我这样做时，我得到的是false和true。我想我得到了，不确定。快速建立一个JSFIDLE？很难将其建立在JSFIDLE中，因为它是由adobe edge animate制作的。因此html和css不是用代码创建的……也许我可以将整个项目发送给您？因此，它显示9种颜色。然后在顶部显示颜色的名称，您需要单击颜色与显示名称对应的单元格？好的！非常感谢，我来试试！
<div>Please click the colour: <span id="name"></span></div>
<p/>
<div id="Stage_placeholder_rectangles">
    <div id="Stage_placeholder_rectangles_red" class="square red" value=0 width="25" height="25"></div>
    <div id="Stage_placeholder_rectangles_pink" class="square pink" value=1 width="25" height="25"></div>
    <div id="Stage_placeholder_rectangles_orange" class="square orange" value=2 width=25 height="25"></div>
 </div>
<p/>
<div id="result"></div>

var colors = ["red","pink","orange"],
gameStarted = true, newRandom, pastRandom;

function randomNumber(){
    random = Math.floor(Math.random() * 3);
    return random;
}


var giveOption = function() {
    while(pastRandom == newRandom){
        newRandom = randomNumber();
    }
    pastRandom = newRandom;
    $("#name").html(colors[newRandom]);
};
$("#Stage_placeholder_rectangles").click(function(e){
    var val = $(e.target).attr("value"), 
        resultDiv = $("#result");
    if(val == newRandom){
        resultDiv.html("right!");
        giveOption();
    } else {
        resultDiv.html("Wrong! Sorry. Game over");
       gameOver = true;
    }
});

giveOption();