如何使用JavaScript和Meteor模板听所有文档上的按键？

我发现，如果我想听取所有文件，我应该：

$(document).keydown(function(e) {
          console.log(e);
          console.log(e.keyCode);
             if (e.keyCode == 27) {
               $('#tftextinput').value="";
               $('#tfbutton').click();
            }
});

但它不会在控制台中写入任何内容。。。因此，我尝试了另一个类似的版本：

$(".container.body").keydown(function(e) {
          console.log(e);
          console.log(e.keyCode);
             if (e.keyCode == 27) {
               $('#tftextinput').value="";
               $('#tfbutton').click();
            }
 });

此代码位于

$（document）.ready（function（）{}）中；

但是什么也没发生

编辑：

如果我在web控制台中编写此代码，它可以工作：

那么为什么它在我的Meteor模板代码中不起作用呢

Template.home.onRendered(function() {
    $(document).ready(function() {
        /*
        this method listen if we press "enter" in the research field and click on the button
        */
        $('#tftextinput').keypress(function(e) {
            if (e.keyCode == 13) {
                $('#tfbutton').click();
            }
        });
        $(document).keydown(function(e) {
          console.log(e);
          console.log(e.keyCode);
             if (e.keyCode == 27) {
               $('#tftextinput').value="";
               $('#tfbutton').click();
            }
        });
    });
});

第一个侦听器工作（侦听

tftput

的侦听器）

尝试窗口

$(window).on("keydown",function(e) {
          console.log(e);
          console.log(e.keyCode);
             if (e.keyCode == 27) {
               $('#tftextinput').value="";
               $('#tfbutton').click();
            }
 });

试穿窗户

$(window).on("keydown",function(e) {
          console.log(e);
          console.log(e.keyCode);
             if (e.keyCode == 27) {
               $('#tftextinput').value="";
               $('#tfbutton').click();
            }
 });

---

您可以使用模板事件执行相同的操作：

Template.home.events({
   'keydown':function(event){
       ...
   },
   'keypress #tftextinput': function(event){
       ...
   }
});

---

您可以使用模板事件执行相同的操作：

Template.home.events({
   'keydown':function(event){
       ...
   },
   'keypress #tftextinput': function(event){
       ...
   }
});

---

终于成功了，我只好把它放在另一个地方谢谢！请记住，此代码不会自动清除。因此，如果您在

onRendered

回调中有此函数，则每次渲染该模板时，它都会附加“keydown”事件侦听器。假设您来回导航，模板被渲染5次，这样您将有5个键控处理程序附加到窗口对象。我主张使用模板级帮助程序，或者如果您真的需要将事件侦听器附加到

窗口

，那么请在onDestroyed回调中进行清理：

template.home.onDestroyed（function（）{$（window.off）（“keydown”）}

最后它可以工作了，我只需将它放在其他地方谢谢！请记住，此代码不会自动清除。因此，如果您在

onRendered

回调中有此函数，则每次渲染该模板时，它都会附加“keydown”事件侦听器。假设您来回导航，模板被渲染5次，这样您将有5个键控处理程序附加到窗口对象。我主张使用模板级帮助程序，或者如果您真的需要将事件侦听器附加到

窗口

，请在onDestroyed回调中进行清理：

template.home.onDestroyed（function（）{$（window.off）（“keydown”）}

这是最好的流星答案。这是最好的流星答案。