jQuery - soundmanager2 显示每个轨道的不同图像

Question

我正在使用 soundmanager2 jquery 插件，我想为每个轨道显示不同的图像。然而，它只为每个轨道显示相同的图像。 (轨道1.jpg)

html:

<div class="ui360"><a href="audio/track1.m4a" data-src="track1.jpg">Track 1</a></div>
<div class="ui360"><a href="audio/track2.m4a" data-src="track2.jpg">Track 2</a></div>
<img src="img/cover.jpg" id="track-img">

jquery 代码:

$('.ui360 a').on('click', function(){ 
  $("#track-img").attr("src", $(".ui360 a").attr("data-src"));
});

Answer 1

尝试使用$(this), .data():

$('.ui360 a').on('click', function(){ 
   $("#track-img").attr("src", $(this).data("src"));
});

在 .ui360 元素中可用的 anchor 上绑定(bind)一个 click 事件，然后使用以下命令更改 #track-img 的 src $(this).data("src")。它在选择器的上下文中运行。它更改目标图像的 src 属性。