首页 / JAVASCRIPT / 网页中表单按回车就自动提交的问题的解决方案_基础知识

网页中表单按回车就自动提交的问题的解决方案_基础知识

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了网页中表单按回车就自动提交的问题的解决方案_基础知识，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1122字，纯文字阅读大概需要2分钟。

内容图文

1、当form表单中只有一个时按回车键将会自动将表单提交。

代码如下:


再添加一个

代码如下:


按下回车将不会自动提交，但是页面上显示一个不知所云的输入框挺别扭，后从网上搜到两个解决办法：
（1）添加一个

代码如下:


不显示输入框，然后回车之后也不会提交：

代码如下:


（2）添加一个onkeydown事件，然后回车之后也不会显示：

代码如下:


如果想添加回车事件可以在onkeydown事件中添加判断提交表单：

代码如下:


我们有时候希望回车键敲在文本框（input element）里来提交表单（form），但有时候又不希望如此。比如搜索行为，希望输入完关键词之后直接按回车键立即提交表单，而有些复杂表单，可能要避免回车键误操作在未完成表单填写的时候就触发了表单提交。

要控制这些行为，不需要借助JS，浏览器已经帮我们做了这些处理，这里总结几条规则：

如果表单里有一个type="submit"的按钮，回车键生效。

如果表单里只有一个type="text"的input，不管按钮是什么type，回车键生效。

如果按钮不是用input，而是用button，并且没有加type，IE下默认为type=button，FX默认为type=submit。

其他表单元素如textarea、select不影响，radio checkbox不影响触发规则，但本身在FX下会响应回车键，在IE下不响应。

type="image"的input，效果等同于type="submit"，不知道为什么会设计这样一种type，不推荐使用，应该用CSS添加背景图合适些。

内容总结

以上是互联网集市为您收集整理的网页中表单按回车就自动提交的问题的解决方案_基础知识全部内容，希望文章能够帮你解决网页中表单按回车就自动提交的问题的解决方案_基础知识所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/322424.html

来源：【匿名】