如何在单击另一个元素时显示元素并隐藏

Question

我有一系列div元素，我用下面的代码触发。

$(".course_id").on("click", function(){
     var id = $(this).data("id");
     $("div#lessons_by_course_" + id).removeClass("hidden");
});

div有一个名为lessons_by_course + id的id，例如

<div id="lessons_by_course1"></div>

使用ruby on rails .each loop动态解析id号。

我想要的是当我点击div我希望它显示时，当我点击另一个div时，我希望jquery隐藏显示的最后一个并显示我下一个点击的那个。

请注意.course_id是许多元​​素的类，因此，每次单击某个元素时，会弹出一个不同的div，因为每次ID都不同。

Answer 1

您可以将最后显示的元素的id缓存在全局变量中：

var id;

然后在你的循环中：

$(".course_id").on("click", function(){
    if(id) {
        $("div#lessons_by_course_" + id).addClass("hidden");
    }
    id = $(this).id;
    $(this).removeClass("hidden");
});