两个相同的按键事件；只有一个作品

Question

我正在尝试使用 Meter 构建一个网络应用程序。我在 client.js 中有这个：

Template.messages.helpers({
    messages: function() {
        return Messages.find({}, { sort: { time: -1}});
    }

})

Template.chats.helpers({
    chats: function() {
        return Chats.find({}, { sort: { time: -1}});
    }

})

Template.input.events({
    "keydown input#message" : function (event) {
      if (event.which == 13) { // 13 is the enter key event
        if (Meteor.user())
          var name = Meteor.user().username;
        else
          var name = 'Anonymous';
        var message = document.getElementById('message');

        if (message.value != '') {
          Messages.insert({
            name: name,
            message: message.value,
            time: Date.now(),
          });

          document.getElementById('message').value = '';
          message.value = '';
        }
      }
    }
});

Template.inputchat.events({
    "keydown inputchat#chatid" : function (event) {
        if (event.which == 13) { // 13 is the enter key event
          if (Meteor.user())
            var name = Meteor.user().username;
          else
            var name = 'Anonymous';
          var chat = document.getElementById('chatid');

          if (chat.value != '') {
            Chats.insert({
              name: name,
              title: chat.value,
              time: Date.now(),
            });

            document.getElementById('chatid').value = '';
            chat.value = '';
          }
        }
    }
});

在我的 html 文件中：

<template name="Index">
<body>
  {{> input }}
  {{> messages }}
  {{> inputchat }}
  {{> chats }}
</body>
</template>
<template name="input">
  <p>Message: <input type="text" id="message"></p>
</template>

<template name="inputchat">
  <p>Chat name: <input type="text" id="chatid"></p>
</template>

<template name="messages">
  {{#each messages}}
    <strong>{{name}}:</strong> {{message}}<br>
  {{/each}}
</template>

<template name="chats">
  {{#each chats}}
    <strong>{{name}}:</strong> {{chat}}<br>
  {{/each}}
</template>

最后，models.js中的这个：

Messages = new Mongo.Collection('messages');
Chats = new Mongo.Collection('chats');

当我输入内容并在 {{> input }} 上按回车键时，一切正常。消息被添加到集合和模板中，输入框变为空。

我在 inputchat 上输入并按回车键时也在寻找同样的东西。但是，没有任何反应。谢谢

Answer 1

试试看 第一个解决方案

 Template.input.events({
        "keydown #message" : function (event) {
       }
     })

使用 IDS

第二种解法

也将 "keydown inpuchat" 替换为 "keydown input#chatid

两个相同的按键事件；只有一个作品

Two identical keydown events; only one works

javascript

meteor