HTML防止input回车提交表单
原链接:https://blog.csdn.net/ligang2585116/article/details/44699567
自动提交情况说明:
1.默认情况下,单个输入框,无论按钮的type="submit"还是type="button"类型,回车即提交。
2.当type="submit"时,无论有几个type="text"输入框,回车均表示提交。(<button>按钮默认的type为submit)
3.当type="button"时,且存在多个输入框,回车不提交。(button)
解决方案:
1.解决单个输入框的回车即提交问题,可以增加一个隐藏的input="text" display='none'; 然后type类型为button。
2.在form表单或input中加入:onkeydown="if(event.keyCode==13){return false;}"
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>Document</title>
</head> <body>
<form action="www.baidu.com" method="post" onkeydown="if(event.keyCode==13){return false;}">
<input type="text" value="" />
<input type="text" value="" />
<button>提交</button>
<!-- 或在对应input上添加,同时建议取消自动填充,因为mac下会有问题<input type="text" value="" autocomplete="off" onkeydown="if(event.keyCode==13){return false;}" /> -->
</form>
</body> </html>
HTML防止input回车提交表单的更多相关文章
- jquery回车提交表单
jquery回车提交表单,比较方便的功能. 三个事件keydown,keypress,keyup,分别是按下,按着没上抬,上抬键盘 ,所以用keyup. $(document).keyup(funct ...
- js监听键盘触发按钮事件,回车提交表单
/*回车提交表单*/ $(document).keydown(function(event){ if(event.keyCode == 13){ //alert('你按下了Enter'); $(&qu ...
- 阻止form元素内的input标签回车提交表单
<form></form>标签内input元素回车会默认提交表单. 阻止回车默认提交表单: $('form').on('keydown', function (event) { ...
- js 回车提交表单的实现
我们有时候希望回车键敲在文本框(input element)里来提交表单(form),但有时候又不希望如此.比如搜索行为,希望输入完关键词之后直接按回车键立即提交表单,而有些复杂表单,可能要避免回车键 ...
- JQuery禁止回车提交表单
//禁止回车键提交表单——动态绑定 $(function(){ $("input").on('keypress', //所有input标签回车无效,当然,可以根据需求自定义 fu ...
- Ajax异步按下回车提交表单
作者:故事我忘了¢个人微信公众号:程序猿的月光宝盒 html <form id="findInvis"> 帖子标题: <input title="请输入 ...
- Javascript屏蔽回车提交表单
html利用input防止回车提交 默认情况下,单个输入框,无论按钮的type="submit"还是type="button"类型,回车即提交. 1.当type ...
- js 回车提交表单
一.整个页面用一个回车提交事件: <input type="button" value="回车提交" id="auto" onclic ...
- jquery输入框按下回车提交表单
jQuery on()方法是官方推荐的绑定事件的一个方法 $('#password').on('keydown', function(e) { // 短路语法,当e.keyCode == 13成立的时 ...
随机推荐
- 菜单与内容下拉jQuery
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Mybatis之XML使用Enum枚举传递数据
在Mybatis中,处理枚举类的TypeHandler有两个: EnumTypeHandler: 用于保存枚举名 EnumOrdinalTypeHandler: 用于保存枚举的序号. 在实际项目中,以 ...
- blocking network call
[blocking network call] 阻塞的网络调用: 1.gethostbyname(): does not return until it has succeeded or failed ...
- python全栈考试
1.执行 Python 脚本的两种方式 shell直接调用python脚本 python run.py 调用解释器来调用脚本 2.2.简述位.字节的关系 每8个位bit,组成一个字节byte. 一个 ...
- yarn 完美替代 npm
众所周知,npm是nodejs默认的包管理工具,我们通过npm可以下载安装或者发布包,但是npm其实存在着很多小问题,比如安装速度慢.每次都要在线重新安装等,而yarn也正是为了解决npm当前存在的问 ...
- 最意想不到的5个APP UI 设计范例
现如今,智能手机已成为人们生活中不可或缺的一个物件,琳琅满目的手机APP充斥着各大应用市场.对于普通人来说,他们的衣食住行因此而变得简单方便:对设计师们来说,他们则面临更多的机遇和挑战.每位设计师都梦 ...
- ORACLE DBLINK 使用
CREATE PUBLIC DATABASE LINK MYDBLINK CONNECT TO RAMS IDENTIFIED BY RAMS USING '(DESCRIPTION =(ADDRES ...
- c++沉思录中 对字符串进行围边 横向连接 竖向连接操作的练习
// MyPics.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <string> #include < ...
- openssl生成ssl证书(转)
原文:http://blog.sina.com.cn/s/blog_4fd50c390101891c.html x509证书一般会用到三类文,key,csr,crt. Key 是私用密钥openssl ...
- CodeForces 513A Game (水题,博弈)
题意:两个人有n1,n2个球,然后分别最多拿出 k1,k2个球,然后扔掉,谁先拿完谁输. 析:很简单么,每人都足够聪明,就每次扔一个好了,那么,谁的球多,谁就能赢呗,如果相等,那么第一个扔的输. 代码 ...