form表单回车提交问题 【转】

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

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

1. 如果表单里有一个type=”submit”的按钮,回车键生效。
2. 如果表单里只有一个type=”text”的input,不管按钮是什么type,回车键生效。
3. 如果按钮不是用input,而是用button,并且没有加type,IE下默认为type=button,FX默认为type=submit。
4. 其他表单元素如textarea、select不影响,radio checkbox不影响触发规则,但本身在FX下会响应回车键,在IE下不响应。
5. type=”image”的input,效果等同于type=”submit”,不知道为什么会设计这样一种type,不推荐使用,应该用CSS添加背景图合适些。

6.我们在处理表单的页面可以检验他是否点击了按钮来控制下面的程序。if($_POST['submit']){ 如果点击了按钮 程序继续}

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


通过以上可知只要把type="submit"改成type="button"然后js提交, 在不要有一个type=”text”的input就行了。就不会发生回车跳转。
但实验发现,ie和火狐不一样,火狐的submit按钮有掩藏的(display:block)和显现的都不行,必须全改,但ie只要显现的没有submit就行了。

http://www.ngui.cc/el/5557563.html

相关文章

js判断未申明的变量

"undefined" typeof 变量名

html字符过长自动换行css

word-break: break-all; word-wrap: break-word; white-space: normal; width: 125px;

[转]js操作剪切板内容Excel多单元格数据到Html table对应单元格的复制

<script type"text/javascript"> //为每个text控件定义“获得输入焦点”和“失去焦点”时的样式 $("input[typetext]").focus(function(){ $(this).css({"background-color":"#FFFFE0"}); …

js调用ifram中的js函数

document.getElementById(framID).contentWindow.functionName(args);

sqlserver Msqlserver服务启动时报1069错误

首先介绍网络上常用的两种解决方法&#xff1a; 1.我的电脑--控制面板--管理工具--服务--右键 MSSQLSERVER--属性--登陆--登陆身份--选择"本地系统帐户" 或: 2.我的电脑--控制面板--管理工具--服务--右键 MSSQLSERVER--属性--登陆--登陆身份--选择"此帐户"…

js四舍五入保留指定小数位

//四舍五入保留二位小数function round(num,dec){ var sNum num ; var idx sNum.indexOf("."); if(idx<0) return num; var n sNum.length - idx -1; if(dec < n){ var e Math.pow(10,dec); return Math.round(nu…

sqlserver 分页的写法

SELECT *FROM ( SELECT TOP 20 * FROM ( SELECT TOP(20 * 4)* FROM (SELECT cDwbh, cDwmc FROM kh)AS xxx ORDER BY cdwmc ASC )AS t1 ORDER BY cdwmc DESC )AS t2ORDER BY cdwmc ASC;

easyui datagrid 得到所有列属性

var sss$(#tt).datagrid(options).columns; for(var i0; i<sss[0].length; i){ //alert(fields[i]); alert(sss[0][i].field" | "sss[0][i].title); }

Java加载src目录下Properties文件

package com.kingzheng.jztag.dao;import java.io.InputStream;import java.sql.Connection;import java.util.Properties;/** * * author kingschan * date 2012-11-28 * description 查询方案操作的数据源连接 */public class QuerySavingConn implements AbstractConnectio…

JSTL报错cannot be resolved in either web.xml

报错信息 The absolute uri: http://java.sun.com/jsp/jstl/core cannot be resolved in either web.xml or the jar files deployed with this application。 解决方案 java.sun.com/jsp/jstl/core 中/jsp 删掉