javascript 按回车键相应按钮提交事件
更新时间：2009年11月02日 17:11:50 作者：
在表单提交前经常遇到表单验证问题而常用的方法有以下两种.
1、使用提交按钮提交，在form表单中的onsubmit事件进行表单验证：
<script type="text/javascript">
function onSub(){
//表单验证代码
}
</script>
<form action="" method="" onsubmit="javascript:onSub();">
2、使用button或图片的onclick事件调用表单验证代码：
<input type="button" name="button" id="button" onclick="javascript:onSub();" />
<img src="图片路径" onclick="javascript:onSub();" />
但是，使用第二种方式进行提交表单时，不能在填写完表单时,按回车不能提交表单。这给客户的
感受是和直接使用提交按钮提交表单是不同的；为了实现此项功能只需在你的页面加上如下javascript代码即可
function butOnClick() {
if (event.keyCode == 13) {
var button = document.getElementById("bsubmit"); //bsubmit 为botton按钮的id
button.click();
return false;
}
}
在你表单最有一个输入项中出发onkeydown事件调用butOnClick()函数即可；例如：登陆程序的最后一项是密码，则
<input type="password" name="userPwd" onkeydown="javascript:butOnClick();" />
这样当你输入完密码后,按下回车键即可实现表单验证和登录操作(如果用户名和密码正确)。这是个人的一点总结，共享出来
大家齐分享！
复制代码 代码如下:
<script type="text/javascript">
function onSub(){
//表单验证代码
}
</script>
<form action="" method="" onsubmit="javascript:onSub();">
2、使用button或图片的onclick事件调用表单验证代码：
复制代码 代码如下:
<input type="button" name="button" id="button" onclick="javascript:onSub();" />
<img src="图片路径" onclick="javascript:onSub();" />
但是，使用第二种方式进行提交表单时，不能在填写完表单时,按回车不能提交表单。这给客户的
感受是和直接使用提交按钮提交表单是不同的；为了实现此项功能只需在你的页面加上如下javascript代码即可
复制代码 代码如下:
function butOnClick() {
if (event.keyCode == 13) {
var button = document.getElementById("bsubmit"); //bsubmit 为botton按钮的id
button.click();
return false;
}
}
在你表单最有一个输入项中出发onkeydown事件调用butOnClick()函数即可；例如：登陆程序的最后一项是密码，则
<input type="password" name="userPwd" onkeydown="javascript:butOnClick();" />
这样当你输入完密码后,按下回车键即可实现表单验证和登录操作(如果用户名和密码正确)。这是个人的一点总结，共享出来
大家齐分享！
相关文章
这篇文章主要介绍了JS实现设置ff与ie元素绝对位置的方法,涉及JavaScript针对页面元素及元素属性的相关操作技巧,需要的朋友可以参考下2016-03-03
js读写COOKIE实现记住帐号或密码的代码(js读写COOKIE)
js实现记住帐号或密码(js读写COOKIE) 的实现代码，原理就是利用cookies保存于读取功能。2010-05-05
JavaScript Rxjs mergeMap 的使用场合
这篇文章主要介绍了JavaScript Rxjs mergeMap 的使用场合,mergeMap 接收一个函数作为输入参数，这个函数的输入参数就是通过 pipe 链接 mergeMap 的 Observable 里包含的元素2022-07-07
什么是函数式编程？根据百度百科的描述，“函数式编程是种编程典范，它将电脑运算视为函数的计算。函数编程语言最重要的基础是 λ 演算（lambda calculus）。而且λ演算的函数可以接受函数当作输入（参数）和输出（返回值）。”2015-10-10
这篇文章主要介绍了js实现的类似于asp数据字典的数据类型代码实例,即js实现的字典数据类型,需要的朋友可以参考下2014-09-09
今天小编就为大家分享一篇layer关闭弹出窗口触发表单提交问题的处理方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
通过js获取上传的图片信息（临时保存路径，名称，大小）然后通过ajax传递给后端的方法
最近有朋友向我请教，使用js获取上传图片的信息然后通过ajax传递给后端，怎么实现呢？通过上网搜索大量资料，下面小编把我的解决办法整理，分享给大家，需要的朋友可以参考下2015-10-10![我也种棵OO树JXTree[js+css+xml]](//img.jbzj.com/images/xgimg/bcimg7.png)
我也种棵OO树JXTree[js+css+xml]...2007-04-04
整体思路是这样的：判断div内部是否为空，如果为空，给出无数据提示；否则显示正常页面，下面给大家分享js判断div内容是否为空的方法，对判断div内容是否为空的相关知识感兴趣的朋友一起学习吧2016-01-01
在使用原生框架开发小程序时遇到一个问题，在 app.wxss 中定义的全局样式在自定义组件中不生效，本文就详细的介绍一下，感兴趣的可以了解一下2021-08-08
![我也种棵OO树JXTree[js+css+xml]](http://img.jbzj.com/images/xgimg/bcimg7.png)
最新评论