javascript - 当它到达第四个选项卡时，它不应该转到第一个选项卡

Question

• 我是 js 新手
• 当我单击左右箭头时，选项卡会转回来
• 但是圆圈应该停止。当它到达第四个选项卡时，它不应该转到第一个选项卡。
• 类似地，左箭头也应该发生这种情况。
• 在下面提供我的代码。

https://codepen.io/chandrashekhar/pen/mMGRbq

 function move(to) {
    var current = $('li.current').index();
    var total = $('.tabs .tab-link').length;
    var add;
    switch (to) {
      case 'left':
        add = -1;
        break;
      case 'right':
        add = 1;
        break;
    }
    $('.tabs li.tab-link').eq((current+add)%total).click();
  }

Answer 1

给你:

function move(to) {
  var current = $('li.current').index();
  var total = $('.tabs .tab-link').length;

  var add;
  switch (to) {
    case 'left':
      current > 0 ? add = -1 : add = 0;   // don't decrement if we're already at the leftmost tab
      break;
    case 'right':
      add = 1;
      break;
  }
  $('.tabs li.tab-link').eq((current+add)).click();   // removed modulus operator to prevent wrapping back to 0
}

• 我在 case 'left': 中添加了一个条件，以检查当前是否位于最左侧的选项卡(索引 0)，如果是，则不再进一步递减。<
• 我已从 $('.tabs li.tab-link').eq((current+add)).click(); 中删除了模数 (%) 运算符，以防止当我们点击右箭头并激活最右边的选项卡时，索引会回绕到 0。