为什么在 Chrome 中按回车键时我的表单没有提交

Why does my form not submit when pressing enter in Chrome?

本文关键字:表单 我的 提交 Chrome 回车 为什么      更新时间:2023-09-26

我的表单使用paper-input字段在chrome中按回车键时不会提交。但是,在所有其他浏览器中按回车键时,它确实会提交。以下是相关代码:

<form [ngFormModel]="loginForm">
    <paper-input type="text"
                 ngControl="username"
                 label="Username"
                 auto-validate
                 pattern="{{usernameValidation.get()}}"
                 maxlength="20"
                 error-message="Alphanumeric and underscore characters only. [1-20]"
                 ngDefaultControl>
        <iron-icon suffix icon="account-circle"></iron-icon>
    </paper-input>
    <paper-input type="password"
                 ngControl="password"
                 label="Password"
                 auto-validate
                 pattern="{{passwordValidation.get()}}"
                 maxlength="60"
                 error-message="Long passwords only. [8-60]"
                 ngDefaultControl>
        <iron-icon suffix icon="fingerprint"></iron-icon>
    </paper-input>
    <paper-input type="submit"
                 value="Log In"
                 (click)="submit()"
                 [disabled]="!loginForm.valid || loading"
                 ngDefaultControl>
    </paper-input>
</form>

我尝试使用ngSubmitsubmit()函数调用移动到表单元素,并尝试在表单中添加隐藏的标准提交输入以诱骗Chrome提交,但没有运气。我还尝试使用标准input元素以及button。任何意见将不胜感激。谢谢!

如果有人想解释反对票,我很乐意修改我的问题。

一种选择是使用 Polymer 中的 a11y 键元素。 你可以做这样的事情:

<iron-a11y-keys  keys="enter" on-keys-pressed="submitForm" id="a11y"></iron-a11y-keys>

这将触发您在元素中定义的"submitForm"方法。 以下是 a11y 键元素的文档: https://elements.polymer-project.org/elements/iron-a11y-keys

相关文章: