Question

我有2个箭头，一个计数器增加1，左侧减少它我想要解决的问题是处理负数的好逻辑（它应该转到列表中的最后一项）而另一个当计数器超过最大项目数时，它应该返回0。

我正在寻找一些很好的逻辑来实现这一目标。

Answer 1

无论何时递增，请检查新值。如果它大于选项总数，则将其重置为零。如果它小于选项总数，请将其设置为最大值。否则，只需+=1或-=1。

例如：

var total = 5,
    currentNumber = 0,
    numContainer = $("#number");

$(".up, .down").on("click", function(){
  currentNumber = parseInt( numContainer.text(), 10 );
  if ( $(this).hasClass("up") ) {
   if ( ++currentNumber > total ) currentNumber = 1; 
  }
  if ( $(this).hasClass("down") ) {
   if ( --currentNumber < 1 ) currentNumber = total; 
  }
  numContainer.text( currentNumber );
});

这可以进一步减少使用三元运算符以及破解短路连接运算符的功能：

var t = 5, c = 0, n = $("#number");

$(".up, .down").on("click", function(){
  c = parseInt( n.text(), 10 );
  $(this).hasClass("up") ? (++c > t) && (c = 1) : (--c < 1) && (c = t); 
  n.text( c );
});

演示：http://jsbin.com/egifas/edit#javascript,live

Answer 2

您可以使用模运算符：

(num + total) % total

如果您想要1..total而不是0..total-1，请使用((num + total) % total) + 1

所以（伪）代码看起来像这样：

function inc() {
    num = (num + 1 + total) % total;
}

function dec() {
    num = (num - 1 + total) % total;
}

+total是必要的，因为模数运算符对负值的行为在不同语言中不一致，并且因为你永远不会得到负值，所以它总是有效。

Answer 3

Theifmaster是对的，几乎就在那里

var num = 0;
var total = 5;
if (direction == 'left') {
num = (num - 1 + total) % total;
}

if (direction == 'right') {
num = (num +  1 + total) % total;
alert(num);

}

所以如果你点击我的例子中的左箭头它应该是-1但是这使得4 mod 5 = 4.我的逻辑太长了这是一个更简洁的方法。

Answer 4

我发现使用％运算符是最简单的方法。它只会增加您根本不需要它的复杂性，imo。但是，我并不是说这是错的。

所以，简单的方法。您所需要的只是幻灯片的总数（或者您拥有的任何元素/对象）。您的两种方法都如下所示：

var counter = 0;
var total = 7; // u will need to set this to your own totalCount value.

function incrementCounter() 
{
  counter = (counter < total - 1) ? counter + 1 : 0;
}


function decrementCounter() 
{
  counter = (counter > 1) ? counter - 1 : total;
}

请注意，那条代码实际上什么也没做。它甚至不检查数据的有效性（即，如果设置了全局变量，如果总数实际上大于零等）。无论如何，基于此，您可以使用此计数器变量来显示某些内容，或移动图像或您在那里做的任何事情。此外，您可能希望将其更改为零索引。如果您在那里使用JS数组，这将非常有用，因此您无需在索引上使用+/- 1来获取元素。

箭头点击jquery

4 个答案: