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 相关文章推荐
jquery创建并行对象或者合并对象的实现代码
Oct 10 Javascript
jquery遍历之parent()和parents()的区别及parentsUntil()方法详解
Dec 02 Javascript
JavaScript实现数组在指定位置插入若干元素的方法
Apr 06 Javascript
javascript笛卡尔积算法实现方法
Apr 08 Javascript
javascript入门之数组[新手必看]
Nov 21 Javascript
JavaScript仿聊天室聊天记录
Dec 27 Javascript
详谈JavaScript的闭包及应用
Jan 17 Javascript
react性能优化达到最大化的方法 immutable.js使用的必要性
Mar 09 Javascript
小程序组件之自定义顶部导航实例
Jun 12 Javascript
javascript中undefined的本质解析
Jul 31 Javascript
微信小程序实现吸顶特效
Jan 08 Javascript
maptalks+three.js+vue webpack实现二维地图上贴三维模型操作
Aug 10 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
PHP实现通过strace定位故障原因的方法
2018/04/29 PHP
php连接sftp的作用以及实例代码
2019/09/23 PHP
Javascript Object.extend
2010/05/18 Javascript
js下利用控制器载入对应脚本
2010/07/17 Javascript
自写的一个jQuery圆角插件
2010/10/26 Javascript
JavaScript高级程序设计(第3版)学习笔记5 js语句
2012/10/11 Javascript
jQuery中dequeue()方法用法实例
2014/12/29 Javascript
js+jquery常用知识点汇总
2015/03/03 Javascript
jQuery自动添加表单项的方法
2015/07/13 Javascript
jQuery grep()方法详解及实例代码
2016/10/30 Javascript
nodejs搭建本地http服务器教程
2017/03/13 NodeJs
JS实现动态添加DOM节点和事件的方法示例
2017/04/28 Javascript
JavaScript中错误正确处理方式小结你用对了吗
2017/10/10 Javascript
bootstrap 路径导航 分页 进度条的实例代码
2018/08/06 Javascript
vue 返回上一页,页面样式错乱的解决
2019/11/14 Javascript
Python格式化压缩后的JS文件的方法
2015/03/05 Python
Python实现微信公众平台自定义菜单实例
2015/03/20 Python
Python抓取百度查询结果的方法
2015/07/08 Python
Python探索之修改Python搜索路径
2017/10/25 Python
pygame游戏之旅 python和pygame安装教程
2018/11/20 Python
Python 中@property的用法详解
2020/01/15 Python
HTML中fieldset标签概述及使用方法
2013/02/01 HTML / CSS
HTML5 Blob 实现文件下载功能的示例代码
2019/11/29 HTML / CSS
草莓巧克力:Shari’s Berries
2017/02/07 全球购物
德国大型和小型家用电器网上商店:Energeto
2019/05/15 全球购物
您附近的水疗和健康场所:Spafinder(美国)
2019/07/05 全球购物
十佳护士获奖感言
2014/02/18 职场文书
就业意向书范文
2014/04/01 职场文书
委托书的格式
2014/08/01 职场文书
优秀党员学习焦裕禄精神思想汇报范文
2014/09/10 职场文书
家庭贫困证明
2014/09/23 职场文书
幼儿园辞职信
2015/05/13 职场文书
2015年学校政教处工作总结
2015/05/26 职场文书
2016学习依法治国心得体会
2016/01/15 职场文书
学校教代会开幕词
2016/03/04 职场文书
win10怎么设置右下角图标不折叠?Win10设置右下角图标不折叠的方法
2022/07/15 数码科技