form中只有一个input按回车键表单会自动提交

在一个form表单中,若只有一个input,按回车键表单会自动提交,但是当表单中存在多个input时,按回车键不会执行任何操作,这是form表单的一个特性,那么如何防止它的自动提交呢?这里提供四种方法。

    第一种方法把表单去掉,这是最管用,但也是最傻的方法,直接添加onclick事件,不用表单提交,这种方法就不赘述了。
    第二种方法,很多人估计都想到过,就是既然一个input会自动提交,多个input就没问题,那么我给它多加一个input不就行了,有些人试过发现不行,那是为什么呢?
    因为他是这么写的,<input type="hidden">,这样当然不行,一个隐藏域,type并不是text,所以不行。
    但是,<input type="text" style="display:none">,使用这种方法就可以了,因为它是用样式隐藏输入框的,实质上还是一个type为text的input。
    第三种方法,这种方法很好用,直接对form进行操作,个人推荐这种方式。直接在form上加上onsubmit="return false;"这段话,它会阻止表单的回车键进行提交。
例:<form action="save.do" method="post"  onsubmit="return false;">
    第四种方法,这种方法是直接对input进行操作,强行将回车键操作去掉,这种方式也不错,在input上加一个onkeydown事件,onkeydown="if(event.keyCode==13){return false;}",阻止回车键的操作
例:<input type="text" onkeydown="if(event.keyCode==13){return false;}">
    以上四种方法都可以防止表单中只有一个input时,按回车键会自动提交表单的问题。
 
若你还有其他方法解决这个问题,欢迎在下方留下你的方式,大家一起讨论,一起进步,做一只有梦想的网虫!

form表单中只有一个input时,按回车键后表单自动提交(form表单的一个小坑)的更多相关文章

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

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

  2. FORM中使用onSubmit="return false"防止表单自动提交,以及submit和button提交表单的区别

    在页面中有多个input type="text"的文本输入框的情况下没有问题,但是当页面中有只有一个文本框的情况下(),就会出现此问题. 后来在form 中添加:onsubmit= ...

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

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

  4. Html 中表单提交的一些知识总结——防止表单自动提交,以及submit和button提交表单的区别

    转自:http://jackaudrey.blog.163.com/blog/static/1314217882010590041833/ 在页面中有多个input type="text&q ...

  5. 按下enter键后表单自动提交问题

    在HTML的form表单里,按下enter键之后,默认情况下表单会自动提交. 在公司一个项目里,按下enter键自动提交表单的查询结果与按下搜索框的搜索结果页面显示不一样,按下搜索按钮之后是通过Aja ...

  6. 遇到的一个Form表单自动提交问题解决办法

    Form 表单中只有一个 input 元素时按回车会默认提交表单.有的时候我们希望按回车可以进行列表查询,但是查询后表单被自动提交了,然后刷新了整个页面.这个时候就需要对这个 Form 表单处理一下以 ...

  7. HTML 之 Web页面表单form中只有一个input的text元素,按回车默认提交

    WEB开发中,如果页面的 form 中只有一个input元素,在该input元素的输入框中按回车(注:此时并没有写对应的onkeydown等事件处理),则浏览器会默认提交表单,请看如下代码: < ...

  8. 按Enter键后Form表单自动提交的问题

    怪事年年有,今年特别多. 话说,最近项目中遇到一件怪事,当我鼠标focus在文本框中,轻轻敲了下回车键,尼玛页面突然刷新了,当时把宝宝给吓得. 接下来就是一番苦逼的烧脑和蛋疼~ 一.被表象所迷惑 突然 ...

  9. form表单自动提交

    form表单提交是web项目中经常遇到的,但是如果form中只有一个input为text类型的输入框时, 需要格外注意,因为这时候只要你按下回车键,form表单就会自动提交,这是form表单的一个特性 ...

随机推荐

  1. Write a program that gives count of common characters presented in an array of strings..(or array of

    转自出处 Write a program that gives count of common characters presented in an array of strings..(or arr ...

  2. HttpUtils 发送http请求工具类

    import java.io.IOException; import java.io.UnsupportedEncodingException; import java.net.URISyntaxEx ...

  3. 杂项-Java:Druod Monitor

    ylbtech-杂项-Java:Druid Monitor 1.返回顶部 1. https://www.cnblogs.com/wanghuijie/p/druid_monitor.html 2. 2 ...

  4. Spark GraphX 聚合操作

    package Spark_GraphX import org.apache.spark.{SparkConf, SparkContext} import org.apache.spark.graph ...

  5. easyui图标对照

    转自:https://blog.csdn.net/qq_34545192/article/details/78250816 原作者文章地址: http://www.cnblogs.com/timeme ...

  6. jquery plupload上传插件

    http://www.jianshu.com/p/047349275cd4 http://www.cnblogs.com/2050/p/3913184.html demo地址: http://chap ...

  7. Tomcat的jvm配置

    Tomcat本身不能直接在计算机上运行,需要依赖于操作系统和一个JAVA虚拟机.Tomcat的内存溢出本质就是JVM内存溢出,JAVA程序启动时JVM会分配一个初始内存和最大内存给程序.当程序需要的内 ...

  8. bzoj 1690: [Usaco2007 Dec]奶牛的旅行【01分数规划+spfa】

    把add传参里的double写成int我也是石乐志-- 首先这个东西长得就很01分数规划 然后我不会证为什么没有8字环,我们假装他没有 那么设len为环长 \[ ans \leq \frac{\sum ...

  9. qW3xT.2挖矿病毒处理方案

    我遇到的是一款qW3xT.2的病毒,网上查了一下,好像是挖矿病毒.在此贴一下我找到的关于病毒的资料.这是我的服务器 这篇文章可谓是出自高手之笔,感觉说的很厉害,但是非专业人士的我有点看不懂,看个大概  ...

  10. Kali linux 2016.2(Rolling)安装之后的常用配置

    前言 使用默认的Kali Linux设置来学习是可以的,但是我们通常要修改系统的一些基本设置,来最大化使用Kali平台的功能. 以下内容 网络的基础知识 使用图形用户界面来配置网卡 使用命令行来配置网 ...