javascript - JQuery - 隐藏/可见时更改元素的 CSS

Question

当单击 anchor 时，我有一个 div 切换。我试图在 div 可见时和隐藏时通过类更改图标，但代码不起作用。

有人知道怎么做吗？

// Toggle design/code
$(".design-n-code").click(function(e) {
    code.toggle();
}); code.hide();

// Handles the icon so users know it's active when code is visible.
if (code.is(':visible')) {
    $(this).addClass('code-active');
} else {
    $(this).removeClass('code-active');
}

Answer 1

您必须将检查可见性的逻辑放入click处理程序中。否则，它只会执行一次，即在脚本执行的整体开始时。

// Toggle design/code
$(".design-n-code").click(function() {
    code.toggle();

    // Handles the icon so users know it's active when code is visible.
    if (code.is(':visible')) {
      $(this).addClass('code-active');
    } else {
      $(this).removeClass('code-active');
    }
});
code.hide();