JavaScript阻止回车提交表单的方法


Posted in Javascript onDecember 30, 2015

大家对回车键的功能应该比较熟悉,比如在windows系统的很多应用程序中,只要点击回车键就可以进入此程序或者开启某项功能,不过有时候我们希望阻止它的功能,例如在填写表单的时候,可能不小心点击回车键造成表单误提交,下面就来简单介绍一下如何实现此功能。代码实例如下:

如何防止回车(enter)键提交表单,其实很简单,就一句话。onkeydown="if(event.keyCode==13)return false;"把这句写在from标签里面就好了。

<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<title>屏蔽回车提交表单功能</title>
<script type="text/javascript">
window.onload=function()
{
 var myform=document.getElementById("myform");
 myform.onkeypress=function(ev)
 {
  var ev=window.event||ev;
  if(ev.keyCode==13||ev.which==13)
  {
    return false;
   }
 }
}
</script>
</head>
<body>
<p>在表单中回车默认会提交表单,在form的onkeypress事件中处理,只要返回false就可禁用回车提交表单</p>
<form id="myform">
<input type="text" name="username"/>
<input type="submit" value="提交"/>
</form>
</body>
</html>

以上代码可以屏蔽点击回车提交表单的功能。代码简单易懂,有不明白的欢迎提出宝贵意见,谢谢大家一直以来对三水点靠木网站的支持。

Javascript 相关文章推荐
学习YUI.Ext 第六天--关于树TreePanel(Part 1)
Mar 10 Javascript
页面调用单个swf文件,嵌套出多个方法。
Nov 21 Javascript
JQuery实现简单验证码提示解决方案
Dec 20 Javascript
js使下拉列表框可编辑不止是选择
Dec 12 Javascript
模拟一个类似百度google的模糊搜索下拉列表
Apr 15 Javascript
js捕捉键盘事件和按键键值的方法
Oct 10 Javascript
node.js学习之base64编码解码
Oct 21 Javascript
Jquery给当前页或者跳转后页面的导航栏添加选中后样式的实例
Dec 08 Javascript
BootStrap表单时间选择器详解
May 09 Javascript
JavaScript中的&quot;=、==、===&quot;区别讲解
Jan 22 Javascript
详解小程序如何动态绑定点击的执行方法
Nov 26 Javascript
vue.js实现简单购物车功能
May 30 Javascript
基于JavaScript代码实现微信扫一扫下载APP
Dec 30 #Javascript
分享两款带遮罩的jQuery弹出框
Dec 30 #Javascript
JavaScript小技巧整理
Dec 30 #Javascript
jQuery拖动元素并对元素进行重新排序
Dec 30 #Javascript
jQuery给元素添加样式的方法详解
Dec 30 #Javascript
Underscore源码分析
Dec 30 #Javascript
Jsonp 关键字详解及json和jsonp的区别,ajax和jsonp的区别
Dec 30 #Javascript
You might like
mysql_connect localhost和127.0.0.1的区别(网络层阐述)
2015/03/26 PHP
微信封装的调用微信签名包的类库
2017/06/08 PHP
PHP中的日期时间处理利器实例(Carbon)
2017/06/09 PHP
PHP实现的观察者模式实例
2017/06/21 PHP
CakePHP框架Model函数定义方法示例
2017/08/04 PHP
thinkPHP3.2.2框架行为扩展及demo示例
2018/06/19 PHP
php+Ajax处理xml与json格式数据的方法示例
2019/03/04 PHP
php+iframe 实现上传文件功能示例
2020/03/04 PHP
IE6,IE7下js动态加载图片不显示错误
2010/07/17 Javascript
JQuery小知识
2010/10/15 Javascript
极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg
2016/05/27 Javascript
JS转换HTML转义符的方法
2016/08/24 Javascript
js鼠标经过tab选项卡时实现切换延迟
2017/03/24 Javascript
jQuery EasyUI tree增加搜索功能的实现方法
2017/04/27 jQuery
JS查找数组中重复元素的方法详解
2017/06/14 Javascript
vue与django集成打包的实现方法
2019/11/11 Javascript
bootstrap-table后端分页功能完整实例
2020/06/01 Javascript
详解Vue.js 响应接口
2020/07/04 Javascript
vue路由的配置和页面切换详解
2020/09/09 Javascript
[02:18]《我与DAC》之工作人员:为了热爱DOTA2的玩家们
2018/03/28 DOTA
Python字符串匹配算法KMP实例
2015/07/18 Python
解决uWSGI的编码问题详解
2017/03/24 Python
python中使用正则表达式的连接符示例代码
2017/10/10 Python
用python3 urllib破解有道翻译反爬虫机制详解
2019/08/14 Python
实现Python与STM32通信方式
2019/12/18 Python
详解CSS3中nth-child与nth-of-type的区别
2017/01/05 HTML / CSS
爱尔兰家电数码商城:Currys PC World爱尔兰
2016/07/23 全球购物
荷兰领先的百货商店:De Bijenkorf
2018/10/17 全球购物
allbeauty美国:英国在线美容店
2019/03/11 全球购物
程序员经常用到的UNIX命令
2015/04/13 面试题
挂职思想汇报
2013/12/31 职场文书
党校培训自我鉴定范文
2014/04/10 职场文书
低碳环保口号
2014/06/12 职场文书
隐形的翅膀观后感
2015/06/10 职场文书
SpringCloud的JPA连接PostgreSql的教程
2021/06/26 Java/Android
Javascript设计模式之原型模式详细
2021/10/05 Javascript