空格单击“未注册”

注意：所有代码都在这个jsFiddle中：http://jsfiddle.net/5qrkk/
我有这段代码在Javascript 中注册空格

$(window).on("keydown", function(key){
    if(key==32){
        console.log("SPACE");
        $(".sh").fadeOut(600).toggleClass("hdt").toggleClass("sh");
        $(".hd").fadeIn(600).toggleClass("sht").toggleClass("hd");
        $(".sht").toggleClass("sh").toggleClass("sht");
        $(".hdt").toggleClass("hd").toggleClass("hdt");
    }
});  

if循环内部的内容使带有sh类的div（如图所示）变得隐藏，并用hdt替换sh类（而不是立即转到hd，因为旧的hd类仍然需要修改）。同样的事情也发生在当前位于hd类的div上（它从隐藏开始）。当我单击空格时，这些事件（包括console.log）都不会发生。我还希望避免将这些放在$(document).ready()函数中，因为这可能会产生错误，因为这会更改DOM，并且每次运行时都需要使用更新的DOM。