0

我在这里遇到了类似的问题： 我解决的特定类的 jQuery 函数。但是它困扰了我，因为它有太多的 div 并且看起来不是很好，所以我重写了我的 HTML 代码并重写了选择器脚本。现在脚本可以很好地加载图像（它将它们全部淡入）但选择根本不起作用。我尝试使用最接近和兄弟姐妹功能，但无济于事。

我该如何解决这个问题？您可以在以下网址找到相关页面：http: //baldino.rs/baby-program/

提前感谢

$(document).ready(function(){

var picture = $('.post-cipela').each(function(index, element) {
$(this).find('.cipela-bg img:eq(0)').fadeIn(500);

$('.colorwrap a').click(function(){
  var index = $(this).find(".colorwrap a").index(this);
    $('.cipela-bg img').fadeOut(200);
    $('.cipela-bg img:eq('+index+')').fadeIn(500);
    });
});

EDIT-1：我修改了我的脚本。现在我遇到了一个问题，因为我的图像多次消失。我该如何解决？- 这是修改后的脚本，可以看到问题的页面在这里： http ://baldino.rs/baby-program

$(document).ready
(
function()
{
$(".cipela-1").fadeIn(200);
$(".colorwrap a").click
(
    function()
    {
        var item = $(this);
        var a = item.attr("rel");
        item.closest(".post-cipela").find(".cipela-1, .cipela-2, .cipela-3, .cipela-
        4").fadeOut(200);
        item.closest(".post-cipela").find("."+a).first().fadeIn(200);

    }
);
} 
);
4

1 回答 1

1

你粘贴的代码被诽谤了，});最后你有一个额外的。

此外，您将 $('.colorwrap a') 选择器包装在.each函数循环中，我不确定您是否是这个意思。

此外，您在确定 this 变量的范围时遗漏了一些内容。

你的这条线each很好。

$(this).find('.cipela-bg img:eq(0)').fadeIn(500);

但是然后你实例化一个点击处理程序

$('.colorwrap a').click(function(){
  var index = $(this).find(".colorwrap a").index(this);

该处理程序中的 $(this) 指的是匹配a的 within .colorwrap。然后，您会在其下方找到另一个实例，.colorwrap a该实例可能不存在，因此您的选择器找不到任何东西。

如果您确实打算在每个 .each 迭代中包装此单击处理程序，则应分配$(this)给循环中的一个变量，并像这样在单击处理程序中使用它

var picture = $('.post-cipela').each(function(index, element) {
    var that =$(this);
    that.find('.cipela-bg img:eq(0)').fadeIn(500);

    $('.colorwrap a').click(function(){
        var index = that.find(".colorwrap a").index(this);
        $('.cipela-bg img').fadeOut(200);
        $('.cipela-bg img:eq('+index+')').fadeIn(500);
    });
});
于 2012-05-11T00:50:53.527 回答