Meteor 由单个文本输入事件调用的多个事件处理程序

我有两个单独的表单输入（都是文本类型），一个在模板A中，一个在模板B中。模板A调用模板B。这两个输入表单的所有特定名称/属性都是唯一的。我在它们自己正确命名的Template.name.events（）中为这两个都提供了事件处理程序

当我构建一个非常简单的测试用例时，没有问题，一切都很好。但在我更大、更复杂的实际应用程序中，当我在模板B表单中输入文本时，会调用正确的模板B提交事件处理程序。然后…将调用提交事件处理程序的模板！即使我只在处理程序B中执行event.PreventDefault调用，也会发生这种情况（附带问题：事件处理程序是否因反应性原因调用过，或者严格地说是“事件发生”原因调用过？）。目前，我可以通过在事件处理程序中检查未定义的name属性并在这种情况下退出来解决这种奇怪的行为，但这只是因为某些地方出了问题。对于我的代码中这种奇怪的行为，有什么建议吗？谢谢

下面是失败案例中两个模板的代码；第一个（entryHall，带有“new room”表单输入）是“A”模板，第二个（knock，带有“knock room”表单输入）是“B”模板。在这两个模板的事件处理代码下面是用于模板定义和调用的html+Handlebar代码。对于冗长的内容和缺少更简单的失败案例，我深表歉意

Template.entryHall.events({

    // NEW ROOM REQUEST PROCESSING
    "submit.new-room": function (event) { 
        event.preventDefault();
        if (event.target.roomName === undefined) {
            console.log ("in submit new room and roomname in event is undefined");
            return;
        }

        var rName = event.target.roomName.value;

        // Is there already a room name of this same name in the Rooms collection?

        var roomsCursor = Rooms.findOne({ roomName: rName });

        if (roomsCursor != null) {

            // It's a dup; don't allow it
            event.target.roomName.value = "Duplicate room name, try again";
            return(null);
        }

        var uName = Session.get ('userName');

        // It's a unique name, put it in the Rooms collection.

        Rooms.insert({
            roomName : rName,
            owner : uName,
            members: [],      // an array of user names
            knockRequests: [],  // an array of user names
            chat : null,
            files : null
        });


        // We have the room document added to the Rooms collection, now we have to
        // add the room to the owned list for the user

        var userEntry = PZUsers.find({ userName : uName }).fetch();

        PZUsers.update({ _id : userEntry[0]._id},
                       { $push: { ownedRooms: rName }});

        ownedRoomCount++;

        roomReactor.changed();

        event.target.roomName.value = "";   
    }   
});

Template.knock.events({

    // Knock on a room request processing

    "submit.knock-room": function (event) {
        // Prevent default browser form submit
        event.preventDefault();
        var knockName = event.target.knockName.value;
        event.target.knockName.value = "";
        console.log("in knock room submit!");

        // Can only knock on a room that exists!

        var knockRoomCursor = Rooms.findOne({ roomName: knockName });
        if (knockRoomCursor == null) {
            console.log ("no such room found to knock on");
            return;
        }

        // Add a knock request to this room, and add this room the the user's  list of "open knocks" rooms

        var roomEntry = Rooms.find({ roomName : knockName }).fetch();
        console.log ("_id of room: " + knockName + " is: " + roomEntry[0]._id);

       Rooms.update({ _id : roomEntry[0]._id },
               { $push: { knockRequests: Session.get('userName') }});
       roomReactor.changed();   
    }
});

下面是调用html的代码：

<template name="entryHall">

    <h2>Welcome {{userName}}</h2>
    <h3>Create a new room:</h3>
    <div class="roomName">
        <form class="new-room">
            <input type="text" name="roomName" id="roomName" placeholder="Select a room name" />
        </form>
    </div>

    {{markNoOwnedRooms}}
    {{#each ownedRooms}}
        {{#if firstOwnedRoom}}
            <h3>Enter one of your own rooms:</h3>
        {{/if}}
        {{ > room }}
    {{/each}}

    {{markNoMemberRooms}}
    {{#each memberRooms}}
        {{#if firstMemberRoom}}
            <h3>Enter one of your member rooms:</h3>
        {{/if}}
        {{ > room }}
    {{/each}}

    <h3>Knock to request entry:</h3>
    {{ > knock }}


</template>

<template name="room">
    <li>{{this}}</li>
</template>

<template name="knock">
    <div class="knockName">
        <form class="knock-room">
            <input type="text" name="knockName" id="knockName" placeholder="Enter room name" />
        </form>
    </div>
</template>

欢迎{{userName}
创建一个新房间：
{{markNoOwnedRooms}}
{{{#每个人都有自己的房间}
{{#如果第一个拥有房间}
进入您自己的一个房间：
{{/if}
{{>房间}
{{/每个}}
{{markNoMemberRooms}}
{{{#每个会员室}
{{#如果是第一个会员室}
进入您的一个会员室：
{{/if}
{{>房间}
{{/每个}}
敲门请求进入：
{{>敲打}
{{this}}

我们可以查看模板的代码吗？在事件处理程序中尝试

事件.stopPropagation（）

。在B（敲打）事件处理程序的开头和结尾都尝试过。两种方式的事件处理程序调用相同。您是否尝试在提交后添加空格（例如submit.new room）？我不知道这是不是有什么奇怪的事情。没有权限访问我的开发机器，否则我会自己测试。这就解决了问题。事件处理程序声明中同样缺少空格，这是我的简单测试用例的一部分，但问题并不存在。神秘但向前…非常感谢！我们可以看到模板的代码吗？在事件处理程序中尝试

event.stopPropagation（）

。在B（敲打）事件处理程序的开头和结尾都尝试过。两种方式的事件处理程序调用相同。您是否尝试在提交后添加空格（例如submit.new room）？我不知道这是不是有什么奇怪的事情。没有权限访问我的开发机器，否则我会自己测试。这就解决了问题。事件处理程序声明中同样缺少空格，这是我的简单测试用例的一部分，但问题并不存在。神秘但向前…非常感谢！