问题:当form表单中只有一个input时,在input中按回车键会自动提交.

解决方案:

  1.form元素上加onsubmit="return false"(推荐)

  2.多个input存在时按回车不会自动提交(注意:表单中有提交按钮的话,该方法不行)

  3.给input绑定onkeydown事件

代码:

  方法一:

    form元素上加onsubmit="return false"

<form action="../test.json" method="get" onsubmit="return false">
<input type="text" name="age" />
</form>

  方法二:

    加一个input时。注意:隐藏的话不能使用type="hidden"(),要使用display:none

<form action="../test.json" method="get">
<input type="text" name="age" />
<input type="text" style="display: none;" />
</form>

  方法三:

    如果onkeydown是回车键(回车的keyCode为13),则return false

<form action="../test.json" method="get">
<input type="text" name="age" onkeydown="if(event.keyCode==13)return false;"/>
</form>

阻止 form 回车 自动提交的更多相关文章

  1. layui form表单 input输入框获取焦点后 阻止Enter回车自动提交

    最简单的解决办法,不影响其他操作,给提交按钮增加 type="button" 属性 完美解决 <button type="button" class=&q ...

  2. html form禁止表单回车自动提交(通常原因是为在ajax提交前、后进行js判断控制)

    @*onkeydown事件用于禁止回车自动提交form,这样就不经过js控制跳转*@ <form action="/Account/CheckPsw" method=&quo ...

  3. 阻止form表单提交的问题

    阻止form表单提交这种场景可能在生活中,我们经常碰到,而在我们第一印象里面可能我们用return false 去阻止表单默认行为. 但是,有中情况我们用return false 不能阻止表单提交 & ...

  4. 用JavaScript实现表单按回车自动提交

    JavaScript实现表单form1按回车自动提交代码如下: <script type="text/javascript"> function submitMe() ...

  5. form表单 一个input时 回车自动提交

    问题描述 form表单中,如果当前表单只有一个input输入框时,单击回车会自动提交当前表单. 解决方案 在当前form表单中添加一个隐藏的input, <input style="d ...

  6. from 表单回车自动提交

    自动提交的情况 1 表单只有单个输入框 2 type=‘submit  这里注意button默认type为submit 解决方法 1 添加一个隐藏的输入框 2 form添加属性 onsubmit=&q ...

  7. form自动提交

    在做项目中,例如b2b的由商城跳往卖家中心的后台,当他既有会员账号又是卖家的时候,让他登录了商城,就不需要卖家登录的时候,处理过程中可以用到form表单自动登录. 实现简单思路:可以再普通会员登录的地 ...

  8. UC浏览器input文本框输入文字回车键自动提交

    这是测试今天在jira给我提出的一个bug 下面是贴的代码 屏蔽或者禁止回车键 <!DOCTYPE html> <html> <head> <meta cha ...

  9. chrome、firefox表单自动提交诱因 -- 非type=hidden的单输入域(input)

    开发任务中遇到很费解的一个form自动提交问题,form中只有一个input时回车会触发自动提交表单,当在多一个非type=hidden的input时,又不会出现表单自动提交. 代码示例: 会出现自动 ...

随机推荐

  1. C# Note15:设置Window图标的正确方式

    Windows Presentation Foundation(WPF)独立应用程序有两种类型的图标: 一个程序集(assembly) 图标,通过在应用程序的项目构建文件中使用<Applicat ...

  2. redis 的简单命令

    以下实例讲解了如何启动 redis 客户端: 启动 redis 客户端,打开终端并输入命令 redis-cli.该命令会连接本地的 redis 服务. $redis-cli redis > re ...

  3. class面向对象-2

    hasattr/getattr/setattr/delattr #通过字符串判断/获取/新增/删除对象属性或方法 class att(object): def __init__(self,var): ...

  4. linux之nload和iftop查看网络使用情况

    操作系统: centos7 nload: yum install -y gcc yum install -y gcc-c++ yum install -y ncurses-devel yum inst ...

  5. ansible的playbook简单使用

    一.介绍 playbook就是一个用yaml语法把多个模块堆起来的一个文件 核心组件: Hosts:执行的远程主机列表Tasks:任务,由模块定义的操作的列表:Varniables:内置变量或自定义变 ...

  6. WPF 将数据源绑定到TreeView控件出现界面卡死的情况

    首先来谈一下实现将自定义的类TreeMode绑定到TreeView控件上的一个基本的思路,由于每一个节点都要包含很多自定义的一些属性信息,因此我们需要将该类TreeMode进行封装,TreeView的 ...

  7. Apache ab 单测 分布式

    使用synchronized 处理并发 缺点:无法做到细粒度控制 只适合单点的情况 使用Redis作为分布式锁 setnx命令 设计模式 :使用 !setnx 加锁 getset命令

  8. Gedit浏览器常用快捷键备注

    此处只记录常用的,而通常意义上的应知应会不做汇总 搜索 : Ctrl +F : 查找字符串 Ctrl + G : 查找字符串的下一实例 Ctrl + Shift + G : 查找字符串的前一实例 Ct ...

  9. spring boot项目基本结构

    /==================================Controller @Controller public class SimpleController { @Autowired ...

  10. hadoop安装要领

    1.安装JDK tar -zxvf jdk-7u75-linux-i586.tar.gz -C /root/training/ vi ~/.bash_profile JAVA_HOME=/root/t ...