Javascript 按enter键提交表单，页面上包含多个文件

我正试图允许我的登录模式提交进入，我有多个登录模式包括在一个页面上，所以我不希望他们都被提交时，用户按下进入。默认情况下，这些模态是隐藏的。当他们按enter键时，应该会触发对模式页脚div的单击

模态的HTML：

<!-- The Modal -->
<div id="myModal" class="modal">
    <!-- Modal content -->
    <div class="modal-content">
        <div class="modal-header" id="modal-header">
            <span class="close">×</span>
            <h1>Team Login</h1>
        </div>
        <div class="modal-body">
            <div style="text-align:left;">
                <form id="teamLogin" name="teamLogin" method="post">
                    <a>User ID</a>
                    <input type="text" name="username" id="username"><br>
                    <a>Password</a>
                    <input type="password" name="password" id="password">
                </form>
            </div>
        </div>
        <div class="modal-footer" id="modal-footer">Login</div>
    </div>
</div>

这是第二模态的JavaSript，除了不同的ID外，它们完全相同：

if ($("#myModalCarrier").length != 0) {
    $(window).keypress(function(e) {
        var keyCode = e.which;
        if (keyCode == 13) {
            $("#modal-footerCarrier").trigger("click");
        }
    });
}

---

当前在回车时，当显示myModal时，它也会提交myModalCarrier，但不是相反的方式。

我可以提供一个替代方案，即只使用HTML，而不使用JavaScript吗？也就是说，提交操作被设计为在HTML表单上默认情况下在enter时发生

如果您提供了“单页上的多个modals”代码示例，我也将解决这个特定问题。实际上，我是根据您提供的示例代码来回答的

要实现，请使用

元素包围您的模式，并使登录成为

type=“submit”

按钮

以下是结果（如果您愿意，请选择jsbin:）：

×
团队登录
用户ID


密码
登录

我可以提供一个替代方案，只使用HTML而不使用JavaScript吗？也就是说，提交操作被设计为在HTML表单上默认情况下在enter时发生

如果您提供了“单页上的多个modals”代码示例，我也将解决这个特定问题。实际上，我是根据您提供的示例代码来回答的

要实现，请使用

元素包围您的模式，并使登录成为

type=“submit”

按钮

以下是结果（如果您愿意，请选择jsbin:）：

×
团队登录
用户ID


密码
登录

由于您正在将侦听器添加到

窗口中，因此在这两种情况下，它始终会触发两段代码，您可能需要考虑在实际表单输入中添加键侦听器。示例：@Marcela我尝试在每个单独的模式中添加一个侦听器，但模拟的单击不会触发。我不是建议将其添加到模式中，而是建议将其添加到输入字段中。此外，与模拟单击不同，您是否可以只调用单击处理程序调用的相同函数？因为您将侦听器添加到
窗口
，在这两种情况下，它始终会触发两段代码，因此您可能需要考虑在实际表单输入上添加键侦听器。示例：@Marcela我尝试在每个单独的模式中添加一个侦听器，但模拟的单击不会触发。我不是建议将其添加到模式中，而是建议将其添加到输入字段中。此外，您可以不模拟单击，而直接调用单击处理程序调用的同一个函数吗？我将其设置为有一个提交按钮和表单标记，但在enter时它不会提交。@Alec-我在两个不同的地方提供的示例是否适用于您？如果是这样，为了让我帮助您，我需要您思考并解释我已经证明有效的内容与您在代码中尝试的内容之间的差异。请像我为您做的那样复制在JSFIDLE中不起作用的内容。谢谢。抱歉，有些东西一定保存在缓存中了，但我让它工作了，谢谢。我将它设置为有一个提交按钮和表单标签，但在输入时它不会提交。@Alec-我在两个不同的地方提供的示例对你有用吗？如果是这样，为了让我帮助您，我需要您思考并解释我已经证明有效的内容与您在代码中尝试的内容之间的差异。请像我为您做的那样复制在JSFIDLE中不起作用的内容。谢谢。抱歉，缓存中一定保存了一些东西，但我让它工作了，谢谢
if ($("#myModalCarrier").length != 0) {
    $(window).keypress(function(e) {
        var keyCode = e.which;
        if (keyCode == 13) {
            $("#modal-footerCarrier").trigger("click");
        }
    });
}