javascript - 使用jquery正确制作.next()元素slideToggle？

Question

目前，下面的代码仅适用于一个容器。我只想制作与单击 SlideToggle 相关的描述。

jquery:

$("#closedImage").click(function(){
    $('#closedImage').css("display", "none");
    $('#openImage').css("display", "block");
    $(this).parent().next(".jobDescription").slideToggle("slow");
});

$("#openImage").click(function(){
    $('#openImage').css("display", "none");
    $('#closedImage').css("display", "block");
    $(this).parent().next(".jobDescription").slideToggle("slow");
}); 

php/html - foreach 循环中的内容:

    echo "<div id=\"theJob\">";
    echo "<a href=\"/job/view/".$job['id']."/".$job['url']."\">";

    echo "<div id=\"leftContain\" class=\"floatLeft\">";
    echo "<h2 class=\"green\">".$job['role']."</h2>";
    echo "<div class=\"blue floatLeft\"><h3>".$job['company']." in ".$job['location']."</h3></div><br><br>";        
    echo "</div>";

    echo "</a>";

    echo "<div id=\"rightContain\" class=\"floatLeft\">";
    echo "<div id=\"closedImage\"><img src=\"/images/side.png\"></div>";    
    echo "<div id=\"openImage\"><img src=\"/images/down.png\"></div>";              
    echo "</div>";

    echo "<div class=\"jobDescription floatLeft\">";
    echo $job['description'];   
    echo "</div>";
    echo "</div>";

提前致谢。

Answer 1

您使用的 foreach 带有 id 而不是类。 jquery 中的选择器只会返回它遇到的第一个 id，其余的将被忽略。

ID 不应在页面上出现多次，并且是无效标记。

将 ID 更改为类，它应该可以解决您的问题:)

希望这有帮助。