Chrome JavaScript滑块问题

我在尝试制作滑块时遇到问题。基本上，它可以自动滚动图像，但是下一个和上一个箭头完全没有效果

单击“下一步”时出现此错误-

未捕获引用错误：未定义库id。js:48 event.returnValue已弃用。请改用标准的event.preventDefault（）。 未捕获引用错误：未定义id

这是小提琴链接-

但这是我的Html和JS-

HTML

画廊

这是JS

sliderInt=1;
sliderNext=2;

$(document).ready(function(){
    $("#slider>img#1").fadeIn(300);
    startSlider();
    $(".right").click(function(){
       next(); 
    });
     $(".left").click(function(){
       next(); 
    });
});

 var count=0;

function startSlider(){
    count=$("#slider>Img").size();

    loop=setInterval(function(){

        if(sliderNext>count){
            sliderNext=1;
            sliderInt=1;
        }

        $("#slider>Img").fadeOut(300);
        $("#slider>Img#" + sliderNext).fadeIn(300);

        sliderInt=sliderNext;
        sliderNext=sliderNext + 1;

    },3000);

}

function prev(){
    newSlide=sliderInt-1;
    showSlide(newSlide);
}

function next(){
    newSlide=sliderInt + 1;
    showSlide(newSlide);
}

function showSlide(){
    if(id>count){
        id=1;
    }else if(id<1){
        id=count;
    }

    $("#slider>Img").fadeOut(300);
    $("#slider>Img#" + id).fadeIn(300);

    sliderInt=id;
    sliderNext=id + 1;

}

sliderInt=1；
sliderNext=2；
$（文档）.ready（函数（）{
$（“#slider>img#1”）.fadeIn（300）；
startSlider（）；
$（“.right”）。单击（函数（）{
next（）；
});
$（“.left”）。单击（函数（）{
next（）；
});
});
var计数=0；
函数startSlider（）{
计数=$（“#滑块>Img”）.size（）；
循环=设置间隔（函数（）{
如果（sliderNext>count）{
sliderNext=1；
滑块=1；
}
$（“#滑块>Img”）.fadeOut（300）；
$（“#slider>Img#”+sliderNext）.fadeIn（300）；
sliderInt=sliderNext；
sliderNext=sliderNext+1；
},3000);
}
函数prev（）{
newSlide=slident-1；
放映幻灯片（新闻幻灯片）；
}
函数next（）{
newSlide=slident+1；
放映幻灯片（新闻幻灯片）；
}
函数showSlide（）{
如果（id>计数）{
id=1；
}如果（id在线上

showSlide(newSlide);

你通过int newSlide，
但是在函数定义中，您没有捕获任何参数

改变

function showSlide(){

到

希望这有帮助
您的代码中有很多逻辑错误，我已经在这里对其进行了调整

代码：

 sliderInt = 1;
 sliderNext = 2;
 var count = 0;
 var loop;

$(document).ready(function () {
  $("#slider>img#1").fadeIn(300);
    startSlider();
    $(".right").click(function (event) {
     //alert("clicked next");
      next();
      event.preventDefault();
   });
   $(".left").click(function (event) {
     prev();
     event.preventDefault();
   });
});



function startSlider() {
 count = $("#slider>Img").size();
 delayCall();

}

 function delayCall() {
  loop = setInterval(function () {

    if (sliderNext > count) {
        sliderNext = 1;
        sliderInt = 1;
    }

    $("#slider>Img").fadeOut(300);
    $("#slider>Img#" + sliderNext).fadeIn(300);

    sliderInt = sliderNext;
    sliderNext = sliderNext + 1;

  }, 3000);

   }

 function prev() {
   // alert("previous");
   clearInterval(loop);
   if (sliderInt == 1) newSlide = count;
   else newSlide = sliderInt - 1;
   showSlide(newSlide);
 }

 function next() {
   // alert(sliderInt+":"+count);
   clearInterval(loop);
   if (sliderInt == count) sliderInt = 0;
      newSlide = sliderInt + 1;
      showSlide(newSlide);
 }

 function showSlide(id) {
    //  alert(id+":"+count);
   /* if(id>count){
       id=1;
      }else{
      id;
   }*/

  $("#slider>Img").fadeOut(300);
 $("#slider>Img#" + id).fadeIn(300).delay(1000);

  //Thread.sleep(3000);
  sliderInt = id;
  sliderNext = id + 1;
  delayCall();

 }

小提琴：

你的代码与Chrome浏览器无关，只是逻辑错误，就是这样。我已经在Firefox 25.0和Chrome 30.0.1599.101上验证了这段代码，它工作正常，希望这能解决你的问题

快乐编码：）
非常感谢您：我之前说过，我不熟悉这一点，所以希望我不会经常犯这些错误。典型的情况是，经过7个小时的尝试，你很容易就回答了。创建应用程序时，语法并不是一件难事，你应该知道的只是正确的逻辑。总之，与您的申请：）
function showSlide(id){

 sliderInt = 1;
 sliderNext = 2;
 var count = 0;
 var loop;

$(document).ready(function () {
  $("#slider>img#1").fadeIn(300);
    startSlider();
    $(".right").click(function (event) {
     //alert("clicked next");
      next();
      event.preventDefault();
   });
   $(".left").click(function (event) {
     prev();
     event.preventDefault();
   });
});



function startSlider() {
 count = $("#slider>Img").size();
 delayCall();

}

 function delayCall() {
  loop = setInterval(function () {

    if (sliderNext > count) {
        sliderNext = 1;
        sliderInt = 1;
    }

    $("#slider>Img").fadeOut(300);
    $("#slider>Img#" + sliderNext).fadeIn(300);

    sliderInt = sliderNext;
    sliderNext = sliderNext + 1;

  }, 3000);

   }

 function prev() {
   // alert("previous");
   clearInterval(loop);
   if (sliderInt == 1) newSlide = count;
   else newSlide = sliderInt - 1;
   showSlide(newSlide);
 }

 function next() {
   // alert(sliderInt+":"+count);
   clearInterval(loop);
   if (sliderInt == count) sliderInt = 0;
      newSlide = sliderInt + 1;
      showSlide(newSlide);
 }

 function showSlide(id) {
    //  alert(id+":"+count);
   /* if(id>count){
       id=1;
      }else{
      id;
   }*/

  $("#slider>Img").fadeOut(300);
 $("#slider>Img#" + id).fadeIn(300).delay(1000);

  //Thread.sleep(3000);
  sliderInt = id;
  sliderNext = id + 1;
  delayCall();

 }