将数组值传递给图像源

我试图获取每个列表项上链接的值并将它们循环到我的.skater_large图像src中。将数组值传递给图像源

下面是HTML：

<html> 
<body> 
    <div> 
    <ul id="skater_multiview"> 
     <li><a href="skater1_big.jpg"><img src="skater1-thumb.jpg" /></a></li> 
     <li><a href="skater2_big.jpg"><img src="skater2-thumb.jpg" /></a></li> 
     <li><a href="skater3_big.jpg"><img src="skater3-thumb.jpg" /></a></li> 
    </ul> 
    </div> 
    <div> 
    <img class="skater_large" src="empty.jpg" /> 
    </div> 
    </body> 
    </html>

和JS：

 $('#skater_multiview li a').each(function(click) { 

     var cardboard = new Array(); 
     for(i=0; i<$('#skater_multiview li a').length; i++) { 

      // gathering all skater carousel list link values 
      var pro_link = $('#skater_multiview li a').eq(i).attr('href'); 

      // adding hrefs to array 
      cardboard.push(pro_link); 
      // pushing cardboard array values into img src 
      $('.skater_large').attr('src',cardboard[i]); 
      }; 
     });

来源

2013-08-01 Skip Zepeda

目前尚不清楚你的问题是什么。你能说出你遇到的问题吗？你期望看到什么以及与期望不符的内容？ – seanmk

更多资讯将提供帮助。看起来for循环将执行得如此之快，以至于$（'。skater_large'）'的src会立即转到最后一个。我想计时器会更好，但正如我所说，我没有达到你的意图。 – 2013-08-01 23:12:36

你的代码也令人困惑。没有'#skater_multiview li a'有一个href属性，所以你为什么试图访问它？ – FakeRainBrigand

我认为你正在寻找的只是取代了src click事件。这应该做

var cardboard = []; 
$('#skater_multiview li a').each(function (index) { 
    // gathering all skater carousel list link values 
    var pro_link = $(this).attr('href'); 
    // adding hrefs to array 
    cardboard.push(pro_link); 
    // pushing cardboard array values into img src 
    $('.skater_large').attr('src', cardboard[i]); 
}); 

// Attach a click event for slater when clicked 
// gets the next image 
var curr; 
$('.skater_large').click(function() { 
    // Get the href attribute 
    var index; 
    if(curr) 
     index = curr >= cardboard.length ? 0 ? curr; 
    else 
     curr = 0; 
    $('.skater_large').attr('src', cardboard[curr]); 
     curr++; 
});

来源

2013-08-01 23:13:59

我试过使用这个标记，但它似乎没有捕获[i]的任何东西.... –

@SkipZepeda ..检查更新代码 –

完美的作品。我正在记录你使用的setTimeout。非常感谢！ –

将数组值传递给图像源

回答

相关问题