Javascript控制回车键进行表单(form)提交(转)
一、采用钩子事件去捕获
键盘事件有3个:
keydown,keypress,keyup分别是按下,按着没上抬,上抬键盘 。
$(document).keyup(function(event){
if(event.keyCode ==13){
$("#submit").trigger("click");
}
});
推荐:keyup,防止笔记本键盘不小心触摸到。
1、有些文档中有写成这样:
$(window).keydown(function(){
...
})
XP系统IE6下是不成功的。
2、还有input的
$("input").keydown(function(){
...
})
这种情况要在input获取焦点时候,才能监听到键盘事件。
二、采用form表单的形式
1、回车测试:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>submit例子 - aspxhome.com</title>
</head>
<body>
<h1>本demo演示在文本框中按enter键是否触发提交表单</h1>
<h2>默认情况下,一个文本框的时候,提交,不管按钮type是submit还是button</h2>
<form action="http://www.csdn.net">
<input type="text">
<input type="button" value="提交">
</form>
<h2>一个文本框的时候怎么才能做到不提交,方法是加一个隐藏掉的文本框</h2>
<form action="http://www.csdn.net">
<input type="text">
<input type="text" style="display:none">
<input type="button" value="提交">
</form>
<h2>只要有type为submit的按钮存在,一个文本框还是多个文本框都提交</h2>
<form action="http://www.csdn.net">
<input type="text">
<input type="submit" value="提交">
</form>
<h2>只要有type为submit的按钮存在,一个文本框还是多个文本框都提交</h2>
<form action="http://www.csdn.net">
<input type="text">
<input type="text">
<input type="submit" value="提交">
</form>
<h2>多个文本框的时候,不提交,用type为button的按钮就行啦</h2>
<form action="http://www.csdn.net">
<input type="text">
<input type="text">
<input type="button" value="提交">
</form>
<h2>用button元素时,FX和IE下有不同的表现</h2>
<form action="http://www.csdn.net">
<input type="text">
<input type="text">
<button>提交</button>
</form>
<h2>radio和checkbox在FX下也会触发提交表单,在IE下不会</h2>
<form action="http://www.csdn.net">
<input type="text">
<input type="radio" name="a">
<input type="checkbox" name="b">
<input type="checkbox" name="c">
<input type="button" value="提交">
</form>
<h2>type为image的按钮,等同于type为submit的效果</h2>
<form action="http://www.csdn.net">
<input type="text">
<input type="text">
<input type="image" src="/images/logo.gif">
</form>
</body>
</html>
2、在form标签中来禁止enter键提交:
<form name="form" action="" method="post" onkeydown="if(event.keyCode==13)return false;" onSubmit="return checkSubmit();">
3、可以在form中增加一个隐藏的输入框。
4、可以在type="test"中增加onkeypress="javascript:return gosearch();"方法。
参考:
http://www.cnblogs.com/soundcode/p/6607746.html(以上内容转自此篇文章)
http://blog.csdn.net/u010871655/article/details/51260878(以上内容小部分转自此篇文章)
Javascript控制回车键进行表单(form)提交(转)的更多相关文章
- ajax+FormData+javascript实现无刷新表单信息提交
ajax+FormData+javascript实现无刷新表单信息提交 原理: dom收集表单信息,利用FormData快速收集表单信息 ,实例化表单数据对象 同时收集fm的表单域信息. var f ...
- form表单中只有一个input时,按回车键后表单自动提交(form表单的一个小坑)
form中只有一个input按回车键表单会自动提交 在一个form表单中,若只有一个input,按回车键表单会自动提交,但是当表单中存在多个input时,按回车键不会执行任何操作,这是form表单的一 ...
- mvc表单Form提交 --实体
1.方式1:字段加验证 @model MvcWeb.Models.UserInfo @{ ViewBag.Title = "Add"; } <h2>Add</h2 ...
- JavaWeb学习总结(十一):Session解决form表单重复提交
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
- java web学习总结(十三) -------------------使用Session防止表单重复提交
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
- JavaWeb防止表单重复提交(转载)
转载自:http://blog.csdn.net/ye1992/article/details/42873219 在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用 ...
- JavaWeb---总结(十三)使用Session防止表单重复提交
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
- [Java拾遗五]使用Session防止表单重复提交
申明:此文章属于转载, 转自博客: http://www.cnblogs.com/xdp-gacl/p/3859416.html在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没 ...
- java web 学习十三(使用session防止表单重复提交)
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
随机推荐
- P3398仓鼠(LCA)
题目描述 小仓鼠的和他的基(mei)友(zi)sugar住在地下洞穴中,每个节点的编号为1~n.地下洞穴是一个树形结构.这一天小仓鼠打算从从他的卧室(a)到餐厅(b),而他的基友同时要从他的卧室(c) ...
- [App Store Connect帮助]一、 App Store Connect 使用入门(1)App Store Connect 工作流程
您使用 App Store Connect 提交并管理您在 App Store 中销售的 App,使用 TestFlight 分发您 App 的 Beta 版本,接受法律协议,输入您的税务和银行业务信 ...
- Java中static方法
今天学习到了并且应用到了java中的静态方法,并且了解到它的好处与缺点. ● 生命周期(Lifecycle): 静态方法(Static Method)与静态成员变量一样,属于类本身,在类装载的时候被装 ...
- web.xml里,classpath使用范围
比如说在web.xml里,配置spring监听. 在标签<param-value>里,classpath指向的配置文件路径应该是在config资源文件夹下的applicationConte ...
- android ListView,GridView 设置某一项显示位置
在项目中有时会用到,当使用 listview 想让它显示某一项,当它又不在前面的位置,可以 使用 //让某一项显示出来(否则可能不在当前) listview.setSelection(positio ...
- Elasticsearch之sense插件安装之后的浏览详解
前提博客是 Elasticsearch之sense插件的安装(图文详解) 立马,可以看到 http://192.168.80.145:5601/app/sense 以后更新
- html5——网络状态
我们可以通过window.onLine来检测,用户当前的网络状况,返回一个布尔值 window.addEventListener("online",function(){ aler ...
- ProE复杂曲线方程:Python Matplotlib 版本代码(L系统,吸引子和分形)
对生长自动机的研究由来已久,并在计算机科学等众多学科中,使用元胞自动机的概念,用于生长模拟.而复杂花纹的生成,则可以通过重写一定的生长规则,使用生成式来模拟自然纹理.当然,很多纹理是由人本身设计的,其 ...
- 关于 实体类中 时间字段 为string 类型和 datatime类型 比较
经发现, 数据库中保存时间格式数据 可以正常 排序, 数据中保存时间格式字符串 排序出现问题 /// <summary> /// 修改时间 /// </summary> pu ...
- css流光效果
css流光效果1: <!DOCTYPE html> <html> <head> <title>ww</title> </head> ...