jQ图像选择器的问题 [英] Problems with jQ image selector

问题描述

我有一个类似的问题：
特定类的jQuery函数
我解决了。但它bug了我，因为它有太多的div，它看起来不是很好，所以我重写了我的HTML代码，重写了选择器脚本。
现在脚本加载图像罚款（它使它们全部消失），但选择根本不工作。
我尝试使用最近和兄弟姐妹功能，但没有效果。

I had a similar problem here: jQuery function for specific class which I solved. But it bugged me because it has too many divs and it does not look very nice, so I rewrote my HTML code and rewrote the selector script. Now the script loads images fine (it fades them all in) but selection does not work at all. I tried using closest and siblings functions, but to no avail.

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

How can I solve this? You can find the page in question at: http://baldino.rs/baby-program/

提前Thanx

$(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);
    });
});

编辑-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);

    }
);
} 
);

推荐答案

您粘贴的代码有误，

另外，你要包装$（'。colorwrap a' ）选择器在你的 .each 函数循环中，我不知道你是否意味着。

In addition, you are wrapping the $('.colorwrap a') selector within your .each function loop, I'm not sure if you meant that.

每个中的这一行都很好。

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

但是您实例化了点击处理程序

but then you instantiate a click handler

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

该处理程序中的$（this）引用匹配的 / code>在 .colorwrap 下，您将找到另一个 .colorwrap a 可能不存在，因此您的选择器找不到任何东西。

the $(this) within that handler refers to the matched a within .colorwrap. You are then finding another instance of .colorwrap a underneath that, which probably doesnt exist, hence your selector not finding anything.

如果你确实打算在每个.each迭代上包装这个点击处理程序，你应该分配 $（this）到您的循环中的变量，并在点击处理程序中使用它

If you do indeed intend on wrapping this click handler on each .each iteration, you should assign $(this) to a variable within your loop, and use it within the click handler like 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);
    });
});

这篇关于jQ图像选择器的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！