游戏不能正常工作的重置功能

我一直在使用Jquery制作一个简单的拼图比赛游戏，除了游戏完成后，一切都还好，单击模式框后它不能正确重设），并且您不能再单击divs再次播放。游戏不能正常工作的重置功能

要查看游戏和代码，请转到http://codepen.io/acnorrisuk/pen/JdoGvP/ 我有console.logged值的数组，以便您可以通过游戏欺骗您的方式来查看重置时会发生什么。

复位功能低于：

function newBoard() { 
    // reset variables 
    tiles_flipped = 0; 
    temp_values.length = 0; 
    tile_values.shuffle(); 
    tile1 = ''; 
    tile2 = ''; 
    $("#board").empty(); 
    $(".tile").removeClass("transform"); 
    $("#score").html("<p>Pairs Found: " + 0 + "</p>"); 
    // gives each div a unique tile number and inserts images 
    for (var i = 0; i < tile_values.length; i++) { 
     $("#board").append("<div class='flip-container flip'>\ 
       <div class='tile flipper' id='" + i + "'>\ 
        <div class='front'></div>\ 
        <div class='back'><img src='" + 
      tile_values[i] + "'>\ 
       </div>\ 
      </div>\ 
     </div>"); 
    } 
};

来源

2015-04-25 Adam Norris

您要删除所有核元件（那些与“瓦”级）当您创建一个新的董事会。这些tile元素具有绑定到它们的click-handler，但新添加的tile元素没有绑定到它们的click处理程序。

您可以移动绑定点击处理程序的代码，使其位于newBoard()函数中（将图元添加到板子之后），但更好的方法是使用事件代理。通过事件委托，您可以将点击处理程序绑定到#board元素，该元素不会被删除并重新添加。但处理程序仍然会调用tile元素。

只要改变这一点：

$(".tile").on("click", function() {

此;

$("#board").on("click", '.tile', function() {

jsfiddle

注：在我的jsfiddle注释掉调用洗牌瓷砖所以更容易完成游戏。

来源

2015-04-25 21:14:17

因为你在你的newBoard功能附加到.tile#board，你需要delegate the click event：

// check if tiles match using a temporary array 
$("#board").on("click", '.tile', function() { 
    ... 
});

Updated Pen

来源

2015-04-25 21:14:26 Und3rTow

我能得到它的工作，看到http://codepen.io/anon/pen/bdNpGK。

问题是，您只是将onClick函数添加到第一组卡。当您重新设置主板时，您将删除所有旧卡，添加了新卡，但从未再次设置点击功能。而不是onClick事件中的匿名函数，它现在每次调用重置时都会添加适当的点击函数。

function newBoard() { 
    ... 

    $(".tile").on("click", onClick); 
} 



function onClick() { 
    ... 
}

来源

2015-04-25 21:16:49 lhoworko

使用$(document).on("click",".tile",function() {...});

http://jsfiddle.net/cnmzxL0a/

来源

2015-04-25 21:31:24 talkhabi

非常感谢您的所有答复。此问题现已得到解决使用：

$（ “＃板”）上（ “点击”， '.tile'，函数（）{ :)

。

来源

2015-04-26 10:32:23

游戏不能正常工作的重置功能

回答

相关问题