使用jQuery previous& amp;下一个按钮

时间:2013-02-23 15:18:57

标签: jquery increment decrement

主图像下方有前一个和下一个按钮,有x张照片(在这种情况下为7),我需要限制添加到x量的值,以便它只能在1到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);
  });
});

2 个答案:

答案 0 :(得分: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);
});

在这种情况下无需使用两个事件处理程序。

答案 1 :(得分:0)

        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 .