0

我有一个使用 jQuery Cycle 构建的内容旋转器,并且正在尝试向其中添加 jQuery Fancybox。

HTML:

<div class="secRotatorSlide">
    <a href="" class="iframe enlargePic">Enlarge</a>
    <img class="slideImg" src="secRotatorImg/slide1.png" alt="Slide 1" />
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>

以上 HTML 有多组。一切都在正确旋转。

jQuery:

jQuery('.secRotatorSlide').find('.slideImg').each(function() {
    var iframeSrc = jQuery(this)[0].src;
    //alert(iframeSrc)
    jQuery('a.enlargePic').attr('href', iframeSrc);    
});

如果我注释掉设置 href 的行,并取消注释警告行,它将一个接一个地正确地警告每个 src。如果我保持原样,它会从最后一组 html 中获取图像 src,并将其应用于所有 html 组中所有的每个 href。

我究竟做错了什么?我认为它在 jQuery 的最后一行,但我不确定。我已经尝试this在最后一行中使用,但这根本没有任何作用。

4

2 回答 2

4

您的选择器jQuery('a.enlargePic')太通用了。这将在 DOM 中找到所有匹配的元素,您正在为其设置 href 值。你需要限制它的范围。

尝试: jQuery(this).siblings('a.enlargePic').attr('href', iframeSrc);

这样,您只需为您正在处理的元素的同一父(兄弟)的子元素设置值。

http://api.jquery.com/siblings/

编辑:如果你所有的图像和锚共享同一个父级,那么考虑$.prev()

于 2013-09-26T19:24:30.763 回答
1
jQuery(this).prev('a.enlargePic').attr('href', iframeSrc);

选择器a.enlargePic选择 DOM 中具有特定类的所有链接。使用当前图像旁边的唯一目标.prev()

于 2013-09-26T19:29:02.820 回答