javascript - 未捕获错误 : Syntax error, 无法识别的表达式::nth-child for simple slide

Question

我正在尝试在我的 Rails 4 应用程序中调整一个非常非常基本的照片 slider 。

我目前将这段代码放在 jQuery(document).ready(); 函数的范围内:

 var total_photos = $("#slides > img").length;
  console.log("photo number: "+ total_photos);
   var curren_photo = 1;

  function changePhotoInSlide(){
    if (curren_photo == total_photos){
      curren_photo=1;
    }
    console.log("in photo slidin!");
    //make current photo display none
    $('#slides:nth-child(curren_photo)').css("display", "none");
    curren_photo = curren_photo + 1;
    $('#slides:nth-child(curren_photo)').css("display", "block");
}

setInterval(changePhotoInSlide(), 4000);

这是我使用的默认文档结构

HTML/HAML

#slides
  %img{:src => "http://d1y0gk5faskefl.cloudfront.net/boston/1.jpg", :height=> 200}/
  %img{:src => "http://d1y0gk5faskefl.cloudfront.net/boston/2.jpg", :height=> 200}/
  %img{:src => "http://d1y0gk5faskefl.cloudfront.net/boston/3.jpg", :height=> 200}/
  %img{:src => "http://d1y0gk5faskefl.cloudfront.net/boston/4.jpg", :height=> 200}/
  %img{:src => "http://d1y0gk5faskefl.cloudfront.net/boston/5.jpg", :height=> 200}/
  %img{:src => "http://d1y0gk5faskefl.cloudfront.net/boston/6.jpg", :height=>200}/
  %img{:src => "http://d1y0gk5faskefl.cloudfront.net/boston/7.jpg", :height=>200}/
  %img{:src => "http://d1y0gk5faskefl.cloudfront.net/boston/8.jpg", :height=>200}/

CSS

#slides img {
  display:none;
}
#slides img{

  position:absolute;
  top:200px;
  left:100px
}

我不太确定出了什么问题，我很欣赏这样做的任何策略。

Answer 1

您应该按如下方式访问第 n 个 child ，

$('#slides:nth-child(' + curren_photo + ')').css("display", "none");