jQuery多类选择问题

jQuery multiple class selection issue

本文关键字:问题 选择 jQuery      更新时间:2023-09-26

我有一个引导转盘。我希望用jQuery和CSS动态填充每张幻灯片的背景,这样我就可以为每张幻灯片设置background-size: cover;

我在每张幻灯片上都有一个属性data-src,它由每张幻灯片对应的图像位置填充。

E。G.

data-src="http://www.clickwallpapers.com/wp-content/uploads/2014/02/Wallpapers.jpg"

我的jQuery代码获取了这一点,并将其应用于该项的CSS。

jQuery

srcImage = $('.item-image').data('src');
$('.item-image').css('background-image', 'url("' + srcImage + '")');

如果只有一张幻灯片,则此代码有效,但当引入新幻灯片时,它会获取最后一张幻灯片的图像并将其应用于所有幻灯片,因为它们都使用相同的类。

我曾尝试使用$(this)选择器,如下所示,但这破坏了整个过程。

$('.item-image').css('background-image', 'url("' + $(this).data('src') + '")');

有人能告诉我正确的方向来获取每个项目的数据属性吗?

JSfiddle我目前拥有的东西

使用.css:的函数重载

$(".item-image").css("background-image", function() {
    return 'url("' + $(this).data('src') + '")';
});

更新的jsFiddle