上一个/下一个功能失败

时间:2013-01-11 18:54:00

标签: javascript jquery

上一个/下一个功能不适用于新的部分选择。这个想法是,当页面加载时,将加载几个幻灯片放映,用户将使用prev / next按钮浏览它们。当他们到达一个部分的末尾时,他们将选择他们想要查看的下一部分。我的问题是,在用户导航到新部分后,prev / next函数不起作用。

这是JSFiddle。所以你不要错过它们,prev / next按钮分别是挂在页面左侧和右侧的prev / next幻灯片的边缘。以下是我认为导致问题的javascript部分。

由于

var secName,
    slideCount,
    centSlide;

liveSec(0);

// Initiate live section
function liveSec(x) {
    centSlide = 0;
    secName = $('#slider > div:eq('+x+')').attr('id');
    slideCount = $('#'+secName+'').children().length;
    $('#'+secName+'').children().first().addClass('liveslide').next().addClass('next');
}

// call prev/next functions
$('#'+secName+' > div').click(function() {
    var index = $('#'+secName+' > div').index(this);
    if (index > centSlide) nextcycle(centSlide, slideCount);
    if (index < centSlide) prevcycle(centSlide, slideCount);
    return false;        
});

// cycle sections   
$('#'+secName+' .select').click(function () {
    if (!e) var e = window.event;
    e.cancelBubble = true;
    if (e.stopPropagation) e.stopPropagation();
    $('.liveslide').removeClass('liveslide');
    $('.prev').removeClass('prev');
    i = $('#'+secName+' .select').index(this);
    liveSec(i);
});

1 个答案:

答案 0 :(得分:0)

您没有将功能分配给其他部分的幻灯片。只有第一部分中的幻灯片定义了onclick功能。确保你在开头循环遍历所有这些

for (var i=0; i < noOfSections; i++)
{
    var secName = sections[i];

   // call prev/next functions
  $('#'+secName+' > div').click(function() {
      var index = $('#'+secName+' > div').index(this);
      if (index > centSlide) nextcycle(centSlide, slideCount);
      if (index < centSlide) prevcycle(centSlide, slideCount);
      return false;        
  });

  // cycle sections   
  $('#'+secName+' .select').click(function () {
      if (!e) var e = window.event;
      e.cancelBubble = true;
      if (e.stopPropagation) e.stopPropagation();
      $('.liveslide').removeClass('liveslide');
      $('.prev').removeClass('prev');
      i = $('#'+secName+' .select').index(this);
      liveSec(i);
  });

}

当你在第二次点击功能下移动liveSec功能的右括号时,实际上对我有用的是,但是我不确定你的部分是如何工作的,所以最终可能会多次分配点击功能,除非你首先解开它。

// Initiate live section
function liveSec(x) 
{
centSlide = 0;
secName = $('#slider > div:eq('+x+')').attr('id');
slideCount = $('#'+secName+'').children().length;         
    $('#'+secName+'').children().first().addClass('liveslide').next().addClass('next');


   // call prev/next functions
$('#'+secName+' > div').click(function() {
    var index = $('#'+secName+' > div').index(this);
    if (index > centSlide) nextcycle(centSlide, slideCount);
    if (index < centSlide) prevcycle(centSlide, slideCount);
    return false;        
    });

    // cycle sections   
$('#'+secName+' .select').click(function () 
    {
    if (!e) var e = window.event;
         e.cancelBubble = true;
         if (e.stopPropagation) e.stopPropagation();
    $('.liveslide').removeClass('liveslide');
    $('.prev').removeClass('prev');
    i = $('#'+secName+' .select').index(this);
    liveSec(i);
});
}