`
opensuse
  • 浏览: 186916 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

一个输入框,按回车自动提交表单

阅读更多

今天同事遇到这样一个问题,一个FORM表单,有个BUTTON按钮。点击按钮后校验数据是否完整。

 

但是一敲回车,居然跳过了验证直接提交了。这很让人郁闷。

 

解决方法有很多,但是不知道原因是什么,苦苦翻找,找到了下面这个文章,记录下来,留个念想。。

 

以下内容转载自: lancelot208

 

一个新增页面,只有一个名称是输入框,

其他的是多重选择框,

当我输完名称的时候,随手按了个回车,发现表单自动提交了,(和同事的现象一致)

这样一来,页面上的js判断都没有 生效.找了好久才发现,

如果表单内只有一个输入框时,按回车会自动提交.

先试着在页面上加个隐藏域,因为它也是input标签的,发现没用.

最后想到对输 入框增加一个onkeydown属性, onkeydown="if(event.keyCode==13){return false;}" ,问题解决了.

PS:这个原因还真够烦人的。有点莫名其妙的意思。记录一下吧。长见识了。


分享到:
评论

相关推荐

    如何防止INPUT按回车自动提交表单FORM

    添加一个不可见的`<input>`元素,这样浏览器会认为表单中有多个输入框,从而避免了回车键的自动提交。 ```html <!doctype html> <title>test <!--增加一个隐藏的input来防止回车自动提交--> ;"> ...

    Form表单按回车自动提交表单的实现方法

    1.form表单中只有一个input标签,按回车键将自动提交表单 当form表单中只有一个<input type=”text” name=’name’ />时按回车键将会自动将表单提交。 <form id='form1' action='a1.jsp' method='post'&gt...

    按回车键提交表单~~~~~

    在Web开发中,我们经常需要为用户提供更友好的交互体验,其中一个常见的需求就是允许用户通过按下回车键来提交表单。这种方法可以提高用户体验,并且在很多场景下是非常实用的。 #### 代码解析: ```javascript ...

    JSP中的FORM表单中只有一个input文本时,按回车键将会自动提交表单

    在JSP中,当一个FORM表单中只有一个INPUT文本输入框时,用户按下回车键,浏览器会默认触发表单的提交动作。这是因为浏览器的默认行为:在一个只有一个单行文本输入域(type="text")的表单里,按下回车键会模拟点击...

    禁止按回车键提交表单的方法

    1. 添加一个隐藏的文本输入框:在表单中添加一个CSS样式为`display:none`的文本输入框,这样即使用户按下回车,也会因为有多个文本输入框而不会触发提交。例如: ```html ``` 2. 使用JavaScript监听键盘事件...

    按回车表单自动提交问题意外发现

    这样,即使表单中只有一个可见的输入框,按下回车键时,浏览器会识别到还有其他表单控件存在,因此不会触发表单的自动提交行为。 最后,需要注意的是,在一些表单设计中,可能会使用JavaScript来控制表单的提交过程...

    ie ,火狐 文本框回车自动提交

    在网页开发过程中,一个常见的需求是当用户在文本框中按下回车键时,自动触发表单提交。这种功能在多种浏览器中实现的方式可能有所不同,尤其是对于IE(Internet Explorer)和Firefox这两种主流浏览器。本文将深入...

    输入框为空回车切换到下一个控件

    当用户在输入框(EditText)中按下回车键,如果输入框内容为空,系统会自动将焦点转移到下一个可编辑的控件,让用户能够连续、流畅地输入数据。这种功能常见于表单填写场景,如注册、登录页面等。 实现这个功能主要...

    说说回车键触发表单提交的问题

    回车键触发表单提交是一个常见的功能,但有时它可能会带来一些问题或需要进行特定的处理。本文将深入探讨回车键如何触发表单提交,以及在实际应用中可能遇到的相关知识点。 首先,我们需要理解HTML表单的基本结构。...

    enter键控制input光标移动到下一个框

    当用户在某个输入框中按下"Enter"键时,事件处理函数会防止默认的表单提交行为,并计算出下一个应该获得焦点的输入框。如果当前输入框是最后一个,`nextInput`将被设置为第一个输入框,确保循环导航。 通过这种方式...

    javascript 回车键触发表单提交的问题

    - 如果只有一个文本输入框且不希望按下回车键时提交表单,可以通过添加一个隐藏的文本输入框来阻止提交行为。 - 对于button元素,为了确保跨浏览器的一致性,最好显式地声明其type属性。 4. 示例代码演示: - 当...

    C#实现回车光标自动跳到下一个控件的几种方法

    当用户在文本框(TextBox)中按下回车键时,通常希望光标能够自动移动到下一个控件,以便连续输入或执行某些操作。本篇文章将深入探讨如何在C#中实现这种功能,主要涉及以下知识点: 1. **事件处理**:在C#中,事件...

    jsp中如何实现按下回车键自动提交表单.docx

    ### 如何在JSP中实现按下回车键自动提交表单 #### 背景介绍 在Web开发中,为了提升用户体验,有时我们需要实现在用户按下回车键时自动提交表单的功能。这对于登录页面、搜索框等场景非常实用。本文将详细介绍如何在...

    没有form表单情况下敲回车键提交表单的js代码.docx

    下面提供了一个简单的JavaScript示例,用于实现在没有`<form>`表单的情况下,通过回车键提交表单的功能: ```html <!DOCTYPE html> , initial-scale=1.0"> 无Form表单回车键提交 请输入搜索关键词"> ()">...

    jsp中如何实现按下回车键自动提交表单

    要实现回车键自动提交表单,我们可以添加一个JavaScript函数,该函数监听键盘事件,并在检测到回车键被按下时模拟点击提交按钮。这里的关键在于捕获键盘事件(`keydown`或`keyup`)并检查其按键码(keyCode)。回车...

    ext输入框点击回车键直接进入查询

    "ext输入框点击回车键直接进入查询"这一主题涉及到的是EXTJS框架中的一个常见功能,即如何在用户在输入框中按下回车键时触发查询操作。EXTJS是一个强大的JavaScript库,用于构建桌面和移动应用,它提供了丰富的组件...

    js实现输入框输入的自动匹配功能

    在JavaScript编程中,输入框自动匹配功能是一种常见的用户体验优化手段,尤其在搜索、表单填写等场景中广泛应用。这种功能可以实时地根据用户输入的内容,从预设的数据集中匹配并展示可能的选项,帮助用户快速找到...

    如何去除表单的回车即提交即回车!=提交

    实现"回车!=提交"的问题,一般可以从...3.解决单个输入框的回车即提交问题,参考第二点:可以增加一个input="text",隐藏; 然后type类型为button。 在实际应用中,input输入框很少只有一个的情况,那么只需记住第二

Global site tag (gtag.js) - Google Analytics