Question

我有一个画廊，用户将单击按钮，画廊html将加载到div幻灯片放映中，并且每次用户单击文本时，将显示下一个div持有人。

问题是，图库总是从TEXT 2而不是TEXT 1开始。任何想法为何？

我的jquery：

$(document).on( "click", ".click", function() {
  var a = "<div class='holder active'>text 1 -> click to text 2</div><div class='holder'>text2 -> click to text 3</div><div class='holder'>text3 -> click to end</div>";

  $('#slideshow').html(a);
  slideSwitch();
});

$(document).on( "click", ".holder", function() {
    slideSwitch();
});

function slideSwitch() {
  var current = $('#slideshow .active');
  current.removeClass('active');
  if (current.next().length) {
      current.next().addClass('active');
  } else {
  alert("end");
    console.log('here');
      $('#slideshow').hide();
  }
}

我的画廊总是从第二篇文章开始。任何想法如何解决这个问题？

http://jsfiddle.net/923ec6zL/

html

<span class=click>click to add html to slideshow div</span>


<div id=slideshow>


</div>

css

.holder{
  display:none;
}

.active{
  display:block;
}

Answer 1

这是因为您开始调用current.next（）激活，而不是先单击将current激活。您应该使用某种变量来检查当前是否没有任何活动，如果有，则将第一个变量设置为活动。（现在默认情况下，第一个处于活动状态，但是直到调用current.next（）时它才被添加）

图库从文本2而不是文本1开始

1 个答案: