使用 jQuery 通过 ESC 键切换类？答案

【问题标题】：Toggle class via ESC key using jQuery?使用 jQuery 通过 ESC 键切换类？
【发布时间】：2013-10-09 17:49:01
【问题描述】：

我已经设置了一个 jQuery 函数，以便在按下 ESC 键时向正文添加一个类。

如何更改下面的代码以在按键时添加和删除类之间切换，而不是只添加一次？

if(key.code == 27 && $(document.body).hasClass('preview-mode'))
     $(document.body).removeClass('preview-mode');

【问题讨论】：

查看 jQuery 的toggleClass()。
谢谢！事后看来，谷歌搜索会更好，因为它是如此明显，但我错误地认为它会更复杂！

标签： jquery removeclass

【解决方案1】：

if(key.code == 27)
    $(document.body).toggleClass('Your_class_2'); //set your default class as preview-mode

更多：jQuery Effects

Toggle Class

Live Demo

【讨论】：

【解决方案2】：

注意： keypress 不会在 google-chrome 中捕获转义键 https://stackoverflow.com/a/3901076/829533

试试这个

$(document).ready(function () {
    $(document).keydown(function(e){

        if(e.keyCode == 27) {
            if ($('body').hasClass('preview-mode')) {
                $('body').removeClass('preview-mode');
            } else {
                $('body').addClass('preview-mode');
            }
        }
    });
});

小提琴 http://jsfiddle.net/tcPfQ/3/

或与toggleClass

$(document).ready(function () {
    $(document).keydown(function(e){

        if(e.keyCode == 27) {
            $('body').toggleClass('preview-mode');
        }
    });
})

小提琴 http://jsfiddle.net/tcPfQ/2/

【讨论】：