带左右箭头切换div的js

var index = 0;
var preText = '';
var nextText = '';
$(function(){
 $('.pretext1').text('无');
 $('.nexttext1').text($('.bannerul>li').eq(index+1).find('.zhankong-title').text());
 $('.pre').click(function(){
  if(index == 0) return;
  index--;
  SetHeadTitle(index);

  SetLiVisible(index);
 });
 $('.next').click(function(){
  debugger;
  if(index == $('.bannerul>li').length-1) return;
  index++;
  SetHeadTitle(index);

  SetLiVisible(index);
 });
})
function SetHeadTitle(index)
{
 if(index ==0)
  {
   preText = '无';
   nextText = $('.bannerul>li').eq(index+1).find('.zhankong-title').text();
  }
  else if(index == $('.bannerul>li').length-1)
  {
   preText = $('.bannerul>li').eq(index-1).find('.zhankong-title').text();
   nextText = '无';
  }
  else
  {
   preText = $('.bannerul>li').eq(index-1).find('.zhankong-title').text();
   nextText = $('.bannerul>li').eq(index+1).find('.zhankong-title').text();
  }
  $('.pretext1').text(preText);
  $('.nexttext1').text(nextText);
}
function SetLiVisible(index)
{
 $('.bannerul>li').each(function(i,item){
   $(this).removeClass('bannerliYes');
   $(this).addClass('bannerliNo');
  });
  $('.bannerul>li').eq(index).removeClass('bannerliNo');
  $('.bannerul>li').eq(index).addClass('bannerliYes');
}

你可能感兴趣的:(带左右箭头切换div的js)