jquery - 单击时显示和隐藏多个 div

Question

我有 3 个链接，每个链接指向文档的不同版本。我怎样才能显示/隐藏它们？

现在，我有一个<div id="defaultTemplate">. 这将是默认设置。在它下面，我有<div id="Option2" class="hidden">和<div id="Option3" class="hidden">

选项 2 和 3 应隐藏，但我想在用户单击链接时显示/隐藏每个选项。

这是我的非工作 jQuery：

$('.option1, .option2, .option3').click(function(){
    var toShow = $(this).attr("class");
    console.log(toShow);
    $('#defaultTemplate').fadeOut(600, function(){
        $('#' + toShow).show();

    });
});

谢谢！

Answer 1

您应该使用#option1, #option2, #option3它可能会有所帮助，因为现在您指的是类而不是 id。

Answer 2

您正在搜索 class 而不是 id 所以试试这个：

$('.' + toShow).show();

或者，如果您搜索 id 而不是更改此行：

$('#option1, #option2, #option3')

Answer 3

O你的身份证有Option2这样的资本id="Option2"

由于您单击的课程很小o，

当你这样做时 -

$('#' + toShow).show();即$('#option2').show();，他们没有ID，option2但他们是ID， Option2

您需要将您的 ID 更改为option1, option2, option3, 小号o

Answer 4

option1 id 未定义。我认为它应该是第一个div。

  $('#Option1, #Option2, #Option3').click(function(){
    var toShow = $(this).attr("class");
    console.log(toShow);
    $('#defaultTemplate').fadeOut(600, function(){
      $('.' + toShow).show();

   });
});