Javascript 为什么我不能正确地递增/递减？

我一直在用自定义动画和prev/next功能构建jquery循环。看见我还没有弄清楚如何使用cycle（）完成此操作。所以我构建了这个。然而，正如所写的，每个函数（prevcycle和nextcycle）只工作一次，因为我没有正确地递增/递减变量。我做错了什么

我对这一切都不熟悉，所以欢迎并赞赏所有建设性的批评

这是我的剧本：

$(document).ready(function() {

var slideCount = $('div.slide').length,
    centSlide = 0, // enter 1 to test prevcycle
    prevSlide = centSlide - 1,
    nextSlide = centSlide + 1;

// initialize
$('.slide:eq('+centSlide+')').addClass('liveslide');
if (prevSlide >= 0 && prevSlide < slideCount) {
    $('.slide:eq('+prevSlide+')').addClass('prev');    
};
if (nextSlide < slideCount) {
    $('.slide:eq('+nextSlide+')').addClass('next');    
};

// next cycle code
$('.slide:eq('+nextSlide+')').click(function() {
    nextcycle(centSlide, slideCount);
});

// prev cycle code
$('.slide:eq('+prevSlide+')').click(function() {
    prevcycle(centSlide, slideCount);
});

// construct functions
function nextcycle(x, y) {
    centSlide = x + 1;
    prevSlide = centSlide - 1;
    nextSlide = centSlide + 1;

    $('.slide:eq('+x+')').removeClass('prev');
    $('.slide:eq('+centSlide+')').animate({
        left: 0,
        height: '90%',
        top: 0    
    }, 1000).removeClass('next').addClass('liveslide');
    if (prevSlide >= 0 && prevSlide < y) {
        $('.slide:eq('+prevSlide+')').animate({
        left: '-79%', 
        height: '80%',
        top: '5%',
    }, 1000).removeClass('liveslide').addClass('prev');    
    };
    if (nextSlide < y) {
        $('.slide:eq('+nextSlide+')').css('left','100%').animate({
        left: '79%'
        }, 1000).addClass('next')
    };
};

function prevcycle(x, y) {
    centSlide = x - 1;
    prevSlide = centSlide - 1;
    nextSlide = centSlide + 1;
    n = x + 1;

    $('.slide:eq('+n+')').removeClass('next');
    $('.slide:eq('+centSlide+')').animate({
        left: 0,
        height: '90%',
        top: 0    
    }, 1000).removeClass('prev').addClass('liveslide');
    if (prevSlide >= 0 && prevSlide < y) {
        $('.slide:eq('+prevSlide+')').css('left','-100%').animate({
        left: '-79%'
        }, 1000).addClass('prev');    
    };
    if (nextSlide < y) {
        $('.slide:eq('+nextSlide+')').animate({
        left: '79%', 
        height: '80%',
        top: '5%',
    }, 1000).removeClass('liveslide').addClass('next');    
    };
};

}); // end ready​

$（文档）.ready（函数（）{
var slideCount=$（'div.slide'）。长度，
centSlide=0，//输入1以测试prevcycle
prevSlide=centSlide-1，
nextSlide=centSlide+1；
//初始化
$（'.slide:eq（'+centSlide+'））.addClass（'liveslide'）；
如果（prevSlide>=0&&prevSlide=0&&prevSlide=0&&prevSlide

问题在于，当centSlide为0时，您正在开始设置事件侦听器。。。也就是说，你只是在听与开始位置相关的事件

我修改了您的单击处理程序，以考虑centSlide的当前值，它工作得很好：

干杯

    $('.slide').click(function() {
      var index = $('.slide').index(this);
      if (index > centSlide) nextcycle(centSlide, slideCount);
      if (index < centSlide) prevcycle(centSlide, slideCount);
      return false;        
    });

$（'.slide'）。单击（函数（）{
风险值指数=$（'.slide'）。指数（本）；
如果（索引>幻灯片）下一个周期（幻灯片，幻灯片计数）；
如果（索引

所有这些代码都和您的问题相关吗？看起来您只是将“单击”处理程序添加到有限数量的元素中。@JamesHill-老实说，我不确定。我相信我的问题是我如何递增/递减。但可能不是。@Pointy-我的目的是将单击事件分配给位于prevSlide和nextSlide位置的幻灯片，每次单击都会发生变化。

eq

方法将为您节省一些字节并提高可读性。如果这回答了您的问题，您应该将其标记为已接受，以便将来对其他人有用。