javascript - 向上/向下计数数组动画

Question

我想在按下左右箭头时使用数组创建一个上下计数动画。

我有 3 个数组，每个箭头将链接到一个 ID。

var KEY = {
  LEFT: 37,
  RIGHT:  39
}

$(function(){
  $(document).keydown(function(e){
    switch(e.which){
      case  KEY.RIGHT:
        // Arrays +1

      break;
      case  KEY.LEFT:
        // Arrays -1

      break;
    }
  });
});

var asiel = [0, 200, 300, 900, 1100, 2000];   

var nareiziger = [0, 200, 300, 900, 1100, 2000];   

var total = [0, 200, 2590, 9000, 11000, 23000];   

演示:codepen

我真的不知道如何处理它。

我该怎么做？

非常感谢您的帮助!

Answer 1

这是一个有用的 fiddle 。只需用位置定义一个新变量并上下计数。

Working Fiddle

var KEY = {
  LEFT: 37,
  RIGHT:  39
}
var asiel = [0, 200, 300, 900, 1100, 2000];   

var nareiziger = [0, 200, 300, 900, 1100, 2000];   

var total = [0, 200, 2590, 9000, 11000, 23000];   

$(function(){
  let pos = 0
  changeVal()
  function changeVal(){
  $("#asiel").html(asiel[pos])
  $("#total").html(total[pos])
  $("#nareiziger").html(nareiziger[pos])
  }
  $(document).keydown(function(e){
    switch(e.which){
      case  KEY.RIGHT:

        pos < total.length ? pos += 1
        : pos = total.length

        changeVal()
        // Arrays +1

      break;
      case  KEY.LEFT:
        pos > 0 ?
        pos -= 1
        : pos = 0

        changeVal()
        // Arrays -1

      break;
    }
  });
});