使用对象的javascript函数

我正在设计一种游戏，其中有一个围绕六边形棋盘的团队基地。这个想法是当点击一个团队基地时，轮到该团队了。我有：

    $('.team').click(function(){
        var teamID=$(this).attr('id');
        explore(teamID);
    });

然后，我使用teamID查找被单击团队的索引，该索引作为json文件中的一个对象存储，该文件具有诸如teamname、score等属性

    function explore(index){         // the game portion
        var turn=file[index];        // finds the team's info from json file
        $('.hex').click(function(){  // when a hex is clicked.... play the game
            alert(turn.teamname);       
            // game elements 
    }

这在第一次总是有效的，但是如果我点击一个不同的团队框，然后点击一个十六进制，它通常会认为这是我之前点击的框的轮到它了。我添加了警报（turn.teamname）以尝试调试。如果单击不同的框，它将始终警告第一个框，然后使用不同的框发送第二个警告。我不明白为什么会有两个警报？因此，它将始终提醒“team1”，然后是“team1”，“team2”。当我点击更多的框时，它会一直发出警报，直到它只对所有框发出警报为止。此外，如果我以前单击过两个以上的框，即使我一直单击同一个十六进制，它似乎在提醒我它是“team1”和“team2”之间交替出现

---

这是我的第一篇stackoverflow帖子，所以我希望它有意义！谢谢

出现这种行为的原因是向dom元素添加事件处理程序，但从不删除它们。你需要改变你处理点击六边形的方式。您可以向包含所有十六进制的父元素添加一次事件处理程序，并检查在事件处理程序中单击了哪个十六进制。 或者，您可以尝试一个更简单的解决方案，在该解决方案中，将事件侦听器添加到hexes中一次，并检查是否有选定的团队：

var turn;
var teamSelected = false;
function explore(index){         // the game portion
    teamSelected = true;
    turn=file[index];        // finds the team's info from json file
}
$('.hex').click(function(){  // when a hex is clicked.... play the game
    if (teamSelected) {
        alert(turn.teamname);       
        // game elements 
        teamSelected = false;
    }
}

---

对于这样的事情，我建议进入流星。反应式编程模型比命令式编程模型干净得多（特别是在游戏中，它可能很快变得复杂）

我觉得这说明了使用这个框架可以非常快速地完成什么（最接近您问题的示例）

要深入研究，我建议您先看一看，然后再继续讨论