jquery - jqueryの矢印クリック

Question

私は2つの矢印を持っています。1つはカウンターを1つ増やし、左側の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

0..total-1ではなく1..totalが必要な場合は、((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;
}

そのコードは実際には何もしません。データの有効性もチェックしません（つまり、グローバル変数が設定されている場合、合計が実際にゼロより大きい場合など）。とにかく、これに基づいて、uはこのカウンター変数を使用して、コンテンツを表示したり、動画を表示したり、そこで何をしているのかを知ることができます。また、ゼロインデックスベースに変更することもできます。これは、そこでJS配列を使用している場合に役立つため、要素を取得するためにインデックスで+/-1を指定する必要はありません。