JQuery - 在键盘按下时切换 CSS 属性答案

【问题标题】：JQuery - Toggle CSS Attribute on Keyboard PressJQuery - 在键盘按下时切换 CSS 属性
【发布时间】：2023-03-14 07:43:02
【问题描述】：

我正在尝试在按下键盘键“t”时更改 css 属性。这是我的代码：

$(document).keypress(function(e) {
    var key = e.which;
    if (key == 116) {
        // if the user pressed 't':
        $("body").css("opacity", "0");
    }
});

问题是当人们单击“t”键时，它会将 css 属性更改为不可见；这是完美的。当他们再次单击“t”时，我需要它再次更改（到以前的状态）。为我犯的任何错误道歉，我对 jQuery 非常陌生。如果您能提供帮助，我将不胜感激。非常感谢，托比。

【问题讨论】：

标签： jquery css keyboard toggle

【解决方案1】：

你可以像这样添加一个类：

.active {
    opacity: 0
}

然后在您按下键时使用 .toggleClass()

切换此类

$(document).keypress(function(e) {
    var key = e.which;
    if (key == 116) {
        // if the user pressed 't':
        $("body").toggleClass("active");
    }
});

【讨论】：

【解决方案2】：

使用类似的东西

$(document).keypress(function(e) {
    var key = e.which;
    if (key == 116) {
        // if the user pressed 't':
        if(!$("body").hasClass('active'))
            $("body").addClass('active').css("opacity", "0");
        else
            $("body").removeClass('active').css("opacity", "1");
    }
});

【讨论】：