神秘的角度行为 - 有些表单在输入时提交，有些则没有

Posted 2023-05-09

【中文标题】神秘的角度行为 - 有些表单在输入时提交，有些则没有

【英文标题】：Mysterious angular behaviour - Some forms submit on enter, others don't

【发布时间】：2016-12-18 00:28:51

【问题描述】：

我正在处理 Angular 的不一致行为以及它处理表单提交的方式。

我有一个不同形式的项目。当用户处于“只读”模式时，表单没有提交按钮，我希望表单不可提交。

除了在没有提交按钮的情况下在 Enter 上提交的表单之外，大多数表单的行为都是正确的。

我创建了一个具有以下两种形式的 plunkr： 一个表单在输入时不提交，而另一个则提交。

Plunkr 链接：http://embed.plnkr.co/TZEJPVivIUTdtIdGeW9P/

形式几乎相同。我没有发现可能导致这种情况的差异。

你能帮我想想如何调试它吗？ 是什么导致了这种行为差异？

【问题讨论】：

“当没有提交按钮时，所有表单都不会提交” 在某些情况下，出于某种原因，这可能是正确的，但一般情况下它是不正确的。 “由于 ng-if 指令，未呈现提交按钮” 在您的示例中没有。

不，在我的示例中，您可以完全删除按钮，表单仍将提交。我看到很多人在 ***s 上询问如何在输入时提交表单，解决方案是随机的 javascript 事件，在这里你有我的简单表单，它以某种方式自行完成

正如我所说：这是预期的行为。准确地说：一种可能的行为，因为它在某种程度上取决于浏览器。 html 规范还要求，如果有提交按钮，但它被禁用，则在输入时不会提交表单。因此，如果在您的示例中 sendingData 是 true，则输入时提交也将不起作用。

你说这是“预期的行为”，但我不相信。所有其他形式的行为都不是这样。那么无论如何，你如何让它在输入时不提交？

软件开发与信念无关。随意阅读 HTML 规范的relevant section。您的问题的答案就是为什么“所有其他形式”的行为不那样的问题的答案。显然这种形式是不同的。也许其他人有一个禁用的提交按钮或捕获按键事件。

【参考方案1】：

我发现这种不一致行为的原因是表单中存在不可见的输入项：

<!-- fake fields are a workaround for chrome autofill getting the wrong fields -->
<input style="display: none" type="password" name="fakepasswordremembered">

谜团解开