0

我遇到了一些 jquery 代码的问题。所以故事是，我正在尝试使用 jquery 编写一个蛇游戏。

$(document).ready(function(e) {
initial_move();
$(document).keydown(function(e){
         switch (e.keyCode) { 
        case 38:
            $('#snake-body').stop().add('#one').animate({marginTop:'-2%'},'fast');
            return('null');
        case 37: 
            return('null');
        case 39:
            return('null');
        case 40: 
            alert('bottom');
            return('null');
          }
      });
});
function initial_move(){
  $('#snake-body').css('margin-left','0%');
  $('#snake-body').animate({marginLeft:'100%'},5000,'linear',initial_move);
}

<div id="wrapper">
<div id="snake-body">
   <div id="2" class="part"></div>
       <div id="1" class="part"></div>
    </div>
</div>

我在试图让蛇部分根据 keydown 移动时被卡住了。当我按向上箭头键时，首先 divid="one"应该向上移动，然后依次id="two"类推。

但是这段代码将两个 div 同时移动到margintop:'-2%'. 我不明白，因为我只针对id="one"代码中的 div ..

   case 38:
   $('#snake-body').stop().add('#one').animate({marginTop:'-2%'},'fast');

我希望有人可以帮助我解决这个问题。提前致谢。

4

1 回答 1

0

这段代码：

$('#snake-body').stop().add('#one').animate({marginTop:'-2%'},'fast');

与此代码相同：

$('#snake-body').stop();
$('#snake-body, #one').animate({marginTop:'-2%'},'fast');

这意味着您正在更新#snake-body, 和#one部分。

这是因为add()将#onediv 添加到您已经选择的内容中......这意味着您同时选择了父级 (#snake-body) 和部分 (#one)。

您可能想要做的是：

$('#snake-body').stop();
$('#one').animate({marginTop:'-2%'},'fast');

根据您的意图.stop()，您可能希望停止各个部分而不是父级：

$('#snake-body .part').stop();
$('#one').animate({marginTop:'-2%'},'fast');
于 2013-06-09T19:29:59.313 回答