切换器缩略图不起作用

Question

我需要帮助来修复切换器的缩略图。我不明白为什么代码不起作用。下面的代码html和jQuery。

$(function(){ 
    $(".current-photo-product img:eq(0)").nextAll().hide(); 

    $(".choice-photo ul li img").click(function(e){ 
     var index = $(this).index(); 
     $(".current-photo-product img").eq(index).show().siblings().hide(); 
    }); 
}); 

<div class="product-preview"> 
     <div class="current-photo-product"> 
      <img src="img/product-photo1.png" alt="photo1"> 
      <img src="img/product-photo2.png" alt="photo2"> 
      <img src="img/product-photo3.png" alt="photo3"> 
      <img src="img/product-photo4.png" alt="photo4"> 
     </div> 
     <div class="choice-photo"> 
      <ul> 
       <li><img src="img/product-photo1.png" alt="photo1"></li> 
       <li><img src="img/product-photo2.png" alt="photo2"></li> 
       <li><img src="img/product-photo3.png" alt="photo3"></li> 
       <li><img src="img/product-photo4.png" alt="photo4"></li> 
      </ul> 
     </div> 
</div> 

Answer 1

我相信下面就为你工作

$(function(){ 
    $(".current-photo-product img:eq(0)").nextAll().hide(); 

    $(".choice-photo ul li img").click(function(e){ 
     var index = $(this).parent().index(); 
     $(".current-photo-product img").eq(index).show().siblings().hide(); 
    }); 
}); 

你需要做的IMG标记上方里的索引。