Question

您好：我想知道是否有可能让以下图片一次下载一个。目前，当点击第一个时，它们都会立即下降。我尝试过使用removeClass但是没有任何结果。

代码出现两次，因为我试图显示两个图像。两者最初都是缩略图然后如果该人感兴趣他们会点击并且会出现更大的图像。完成查看后，他们可以单击并删除图像，然后查看图像2并获得相同的机会。如果他们想要看到比缩略图更大的东西，他们会点击它。问题是当点击第一个（或第二个）缩略图时，两个较大的图像一次展开，然后再次收缩。我希望这很清楚，如果需要，我可以尝试进一步澄清。感谢

<div class="JQuery"><!--Begin JQuery-->
<div class="clickMeA"><img src="images/1.jpg" width="124" height="90" /></div>
<div class="picframeA"><img src="images/1LG.jpg"><p>Here is the text</p></div>
  <script src="jquery-1.7.2.min.js"></script>
  <script>
    $(document) .ready(function(){                  
            $(".clickMeA"). click(function() {                                            
            $("img") .fadeIn(1000);
            $(".picframeA") .slideToggle("slow");
        });
    });
    </script>
<div class="clickMeA"><img src="images/2.jpg" width="124" height="90" /></div>
<div class="picframeA"><img src="images/2LG.jpg"><p>Here is the text</p></div>
  <script src="jquery-1.7.2.min.js"></script>
  <script>
    $(document) .ready(function(){                  
            $(".clickMeA"). click(function() {
            $("img") .fadeIn(1000);
            $(".picframeA") .slideToggle("slow");
        });
    });
    </script>
</div>

Answer 1

$(".clickMeA")

这将使用类clickMeA获取所有元素。

$("img")

这会在页面上显示所有 <img>标记。

您只需要包含您的脚本，并且jQuery 一次。您应该将脚本放在<head>中，您需要在每个div之后复制并粘贴整个脚本。

在DOM准备好之前，脚本不会这样，所以你只需要它一次，它将影响所有匹配的元素。

$(document).ready(function(){ // runs after the DOM is ready
    $(".clickMeA").click(function(){ // gets all elements with that class
        // why are you fading in before sliding the div?
        $(this).next(".picframeA").find("img").fadeIn(1000); // target the correct image
        $(this).next(".picframeA").slideToggle("slow"); // target the correct div
    });
});

演示：http://jsfiddle.net/yngEQ/1/

班级开火两次

1 个答案: