form内只有一个输入框时,按回车会自动提交

表单自动提交之谜

最新推荐文章于 2023-03-15 14:19:40 发布

最新推荐文章于 2023-03-15 14:19:40 发布 · 95 阅读

本文探讨了一个关于HTML表单的有趣现象：当表单中仅包含一个输入框时，按下回车键会触发表单的自动提交行为，导致页面上的JavaScript函数未能执行。文章详细解释了这一现象的原因，并提供了一种简单有效的解决方案——通过为输入框添加onkeydown事件来阻止默认行为。

昨天碰到一个问题，一个新增页面,本来我的提交按钮是button类型的,<input type="button" value="提交" onclick="sub()"> 当我输完名称的时候,随手按了个回车,发现表单自动提交了,而其他页面也是这么写的，都没这个问题。这样一来,页面上js的sub()方法里的操作都不起作用。

后来发现这个页面与其他页面唯一的不同是，只有一个名称是输入框,其他的是下拉选择框,问题就是出在这里，如果form表单内只有一个输入框时,按回车会自动提交的。

解决办法：首先试着在页面上加个隐藏域,因为它也是input标签的,发现没用。最后想到对输入框增加一个onkeydown属性, onkeydown="if(event.keyCode==13){return false;}" ,问题解决了。