jquery - 使用jQuery上一个和下一个按钮在递增/递减期间限制x值

Question

主图像下方有上一个和下一个按钮，有 x 数量的照片（在这种情况下为 7），我需要限制添加到 x 数量的值，以便它只能在 1 到 x 的范围内（1在这种情况下为 7）。

显然，当用户到达 x 时，点击下一步应该回到 1。

问题可以在这里看到：http: //mylandscapes.splintertaeal.com/gardens/regents-park.htm

任何帮助将非常感激。

代码：

$(document).ready(function () {
  var el = $('.nr');

  function change(amt) {
    el.text(parseInt(el.text(), 10) + amt);
  }

  $('#next').click(function () {
    change(1);
  });

  $('#prev').click(function () {
    change(-1);
  });
});

Answer 1

我会说你应该完全删除这段代码：

$(document).ready( function() {
    var el = $('.nr');
    function change( amt ) {
        el.text( parseInt( el.text(), 10 ) + amt );
    }
    $('#next').click( function() {
        change( 1 );
    });
    $('#prev').click( function() {
        change( -1 );
    });
});

而是修改以下事件处理程序。

var $nr = $(".nr");
$('#next, #prev').on('click', function() {
    var A = this.id == 'next',X=A?T:0,Y=A?0:T,Z=A?N+1:N-1;N=N==X?Y:Z;
    $("#display").html('<img src="'+$(E[N]).attr('href')+'" />');
    $(".display2").html('<img src="'+$(F[N]).attr('href')+'" />');
    /* Update the slide number */ 
    $nr.text(N + 1);
});

在这种情况下不需要有两个事件处理程序。

Answer 2

        int i = 0
        $(nextbutton).click(function () {
          i++;
          if (i == 7) {
            i = 0;
          }
 showImage(i); // get i indexed image from array
        });

        $(prevbutton).click(function () {
          i--;
          showImage(i); // get i indexed image from array
          if (i == 0) {
            return;
          }
        });

I hope I understood your problem  in a right way .