javascript 按回车键相应按钮提交事件


Posted in Javascript onNovember 02, 2009

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();" />

这样当你输入完密码后,按下回车键即可实现表单验证和登录操作(如果用户名和密码正确)。这是个人的一点总结,共享出来

大家齐分享!

Javascript 相关文章推荐
载入进度条 效果
Jul 08 Javascript
广告显示判断
Aug 31 Javascript
javascript 正则表达式相关应介绍
Nov 27 Javascript
JavaScript实现x秒后自动跳转到一个页面
Jan 03 Javascript
如何使用JS获取IE上传文件路径(IE7,8)
Jul 08 Javascript
jQuery实现的选择商品飞入文本框动画效果完整实例
Aug 10 Javascript
基于JS+Canves实现点击按钮水波纹效果
Sep 15 Javascript
百度多文件异步上传控件webuploader基本用法解析
Nov 07 Javascript
基于vue通用表单解决方案的思考与分析
Mar 16 Javascript
JS如何监听div的resize事件详解
Dec 03 Javascript
11个Javascript小技巧帮你提升代码质量(小结)
Dec 28 Javascript
vue3中的组件间通信
Mar 31 Vue.js
JQuery 解析多维的Json数据格式
Nov 02 #Javascript
javascript(jquery)利用函数修改全局变量的代码
Nov 02 #Javascript
一个可以兼容IE FF的加为首页与加入收藏实现代码
Nov 02 #Javascript
JS OOP包机制,类创建的方法定义
Nov 02 #Javascript
JQuery 网站换肤功能实现代码
Nov 02 #Javascript
Javascript结合css实现网页换肤功能
Nov 02 #Javascript
cnblogs csdn 代码运行框实现代码
Nov 02 #Javascript
You might like
迅雷下载《中学科技》怀旧期刊下载
2021/02/27 无线电
细谈php中SQL注入攻击与XSS攻击
2012/06/10 PHP
php四种基础算法代码实例
2013/10/29 PHP
php简单操作mysql数据库的类
2015/04/16 PHP
关于PHP开发的9条建议
2015/07/27 PHP
php批量删除超链接的实现方法
2015/10/19 PHP
PHP目录操作实例总结
2016/09/27 PHP
JQuery 学习笔记01 JQuery初接触
2010/05/06 Javascript
javascript dom代码应用 简单的相册[firefox only]
2010/06/12 Javascript
统计出现最多的字符次数的js代码
2010/12/03 Javascript
JS生成随机字符串的多种方法
2014/06/10 Javascript
JavaScript字符串对象toUpperCase方法入门实例(用于把字母转换为大写)
2014/10/17 Javascript
JavaScript使用Prototype实现面向对象的方法
2015/04/14 Javascript
基于jQuery实现放大镜特效
2020/10/19 Javascript
javascript 判断是否是微信浏览器的方法
2016/10/09 Javascript
js实现获取鼠标当前的位置
2016/12/14 Javascript
浅谈javascript alert和confirm的美化
2016/12/15 Javascript
JS实现队列的先进先出功能示例
2017/05/10 Javascript
Vue路由跳转问题记录详解
2017/06/15 Javascript
微信小程序引用iconfont图标的方法
2018/10/22 Javascript
egg.js的基本使用和调用数据库的方法示例
2019/05/18 Javascript
JavaScript的变量声明与声明提前用法实例分析
2019/11/26 Javascript
vue+element-ui JYAdmin后台管理系统模板解析
2020/07/28 Javascript
[16:19]教你分分钟做大人——风暴之灵
2015/03/11 DOTA
Python使用matplotlib绘制正弦和余弦曲线的方法示例
2018/01/06 Python
python pands实现execl转csv 并修改csv指定列的方法
2018/12/12 Python
python绘制直方图和密度图的实例
2019/07/08 Python
pytorch 利用lstm做mnist手写数字识别分类的实例
2020/01/10 Python
Python爬虫之App爬虫视频下载的实现
2020/12/08 Python
HTML5超文本标记语言的实现方法
2020/09/24 HTML / CSS
澳大利亚吉他在线:Artist Guitars
2017/03/30 全球购物
PHP高级工程师面试问题推荐
2013/01/18 面试题
负责培养人意见
2015/06/05 职场文书
2016年党支部公开承诺书
2016/03/25 职场文书
甜美蛋糕店的创业计划书模板,拿来即用!
2019/08/21 职场文书
MySQL中一条update语句是如何执行的
2022/03/16 MySQL