Jquery .push不会增加数组的长度

时间:2017-08-29 23:01:59

标签: javascript jquery arrays

我正在构建一个匹配游戏,我不得不尝试将卡值传递给一个空数组,该数组将在数组的长度= 2时检查数字是否匹配。当我记录$ flippedCards的值时,我看到卡片值没有被推到它上面,它的长度仍为0。

$('.card').click(function() {
 MatchGame.flipCard($(this),$('#game'))
});


MatchGame.flipCard = function($card, $game) {

    var $flippedCards = $game.data('flippedCards', []);

    console.log($card.data('flipped')); 
    console.log($card.data('value')); 
    console.log($card.data('color')); 

    if ($card.data('flipped')) {

        console.log('card already flipped'); 
        console.log($flippedCards);
        return;

    } else {

        $card.data('flipped', true);
        $card.css('background-color', $card.data('color'));
        $card.text($card.data('value'));
        $card.css('background-image', null);
        $flippedCards.push($card.data('value'));

        console.log($flippedCards);
    }

};

该项目也可在https://github.com/liviarett/matchgame

获取

2 个答案:

答案 0 :(得分:1)

我克隆并浏览了你的代码。您似乎每次都在初始化一个新的var $flippedCards = $game.data('flippedCards', []);,您可能希望将其初始化到其他位置并将其作为全局变量或将其作为参数传递,否则,它会将其重新初始化为新变量,这就是为什么它没有像你想要的那样递增。

答案 1 :(得分:0)

因为你实际上在这里设置了数据属性:

var $flippedCards = $game.data('flippedCards', []);

jQuery是关于链接的,所以当你执行$ game.data(' filppedCards',[])时,它实际上会返回$ game游戏:

 $game.data('flippedCards', []) === $game // true

您可能有兴趣在之前的某处设置数据属性,可能在renderCards方法中。并设置$ flippedCards而不使用value参数:

var $flippedCards = $game.data('flippedCards');

UPD:你实际上已经在renderCards方法中拥有它了:

$game.empty();
$game.data('flippedCards', []);