回车自动提交表单

我们有时候希望回车键敲在文本框(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添加背景图合适些。
实际应用的时候,要让表单响应回车键很容易,保证表单里有个type=”submit”的按钮就行。而当只有一个文本框又不希望响应回车键怎么办呢?我的方法有点别扭,就是再写一个无意义的文本框,隐藏起来。根据第3条规则,我们在用button的时候,尽量显式声明type以使浏览器表现一致。

时间: 2024-08-06 15:00:32

回车自动提交表单的相关文章

fusioncharts批量导出图片之后自动提交表单

最近一个项目  一个页面有多个fusioncharts,需要将他们一次性导出之后再利用图片做一下操作,制作一个可以客户下载的质检简报. 对客户效果来说,我只需要点击一个按钮就能生成简报并且下载,对开发人员来说就需要,先将图片导出(当然不能挨个导出,要同时执行导出,因为fusioncharts导出太慢了),要确认全部导出了才能提交表单,要不然提交表单之后,图片没有生成出来必然产生异常.下面我们来看一下实现 首先我给每一个fusionchartschart指定一个有规律的id,作用有两个: 一个是导

java 传入用户名和密码并自动提交表单实现登录到其他系统

不用单点登录,模拟远程项目的登录页面表单,在访问这个页面的时候自动提交表单到此项目的登录action,就可以实现登录到其他系统. ssh框架项目 1.以下是本地系统的action代码: 1 import java.io.IOException; 2 import java.util.List; 3 import java.io.BufferedReader; 4 import java.io.IOException; 5 import java.io.InputStreamReader; 6 i

ssi-uploader上传图片插件,点击选择文件按钮自动提交表单解决办法

先介绍一下这款插件,然后再谈使用中可能遇到的问题 ssi-uploader是一个JQuery的图片上传插件,界面比较美观 github地址:https://github.com/ssbeefeater/ssi-uploader 演示地址:http://ssbeefeater.github.io/#ssi-uploader/examples 使用文档:http://ssbeefeater.github.io/#ssi-uploader/documentation 这里就不说明怎么使用了,githu

文件上传控件值发生变化后自动提交表单

当文件上传控件发生变化后自动提交表单,首先在页面加载完成后注册change事件,然后检测到值得变化后提交上传代码,代码备忘. <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script> window.

CI 自动提交表单

//coontrol $this->load->view ( '/' . $this->index_lang ['FOLDER'] . '/eprepag_form.php', $params); //view //eprepag_form.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-

按钮特效-Enter键自动提交表单

—————————————————————— <script type="text/javascript">                        //当用户按下键时            function formKeyPress(event){                if(event.keyCode == 13){            //判断是否按的是Enter键                    document.forms[0].submit

javascripts 实习自动提交表单 onsubmit

html: <form id="formwb" onsubmit="return setPassword();"> <script> document.forms[0].onsubmit(); function setPassword() { //rfb.sendPassword($D('password_input').value); rfb.sendPassword("passw0rd"); return false;

&lt;button&gt;会自动提交表单吗?

点击button以后,表单先由ajax提交,然后无论后台返回什么结果,页面都会跳转到表单action属性指定的路劲,也就是login.html使用的是html.jquery.javascript,后台是spring mvc 代码如下: html表单: XML/HTML code ? 1 2 3 4 5 6 7 8 9 <form action="login.html" method="post" id="loginForm">    

在有多个input的表单当中按回车按钮,如何不自动提交表单,而触发某个按钮的事件

<form action="checkLogin.do" class="login-form" method="post" id="OIform" onSubmit="return false;"> <input type="text" name="notautosubmit" style="display:none"/>