`

form内只有一个输入框时,按回车会自动提交

 
阅读更多

昨天碰到一个问题,一个新增页面,本来我的提交按钮是button类型的,<input type="button" value="提交" onclick="sub()"> 当我输完名称的时候,随手按了个回车,发现表单自动提交了,而其他页面也是这么写的,都没这个问题。这样一来,页面上js的sub()方法里的操作都不起作用。

后来发现这个页面与其他页面唯一的不同是,只有一个名称是输入框,其他的是下拉选择框,问题就是出在这里, 如果form表单内只有一个输入框时,按回车会自动提交的。

解决办法:首先试着在页面上加个隐藏域,因为它也是input标签的,发现没用。最后想到对输入框增加一个onkeydown属性, onkeydown="if(event.keyCode==13){return false;}" ,问题解决了。

分享到:
评论

相关推荐

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

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

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

    添加一个不可见的`&lt;input&gt;`元素,这样浏览器会认为表单中有多个输入框,从而避免了回车键的自动提交。 ```html &lt;!doctype html&gt; &lt;title&gt;test &lt;form action=...

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

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

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

    默认情况下,当表单只有一个文本输入框时,按回车键不会触发任何事件,这与预期的行为不符。为了解决这一问题,可以采用以下几种方法: 1. **禁用`onsubmit`默认行为**:通过设置`onsubmit`属性返回`false`,可以...

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

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

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

    当用户在表单内某输入框按下回车键时,浏览器会默认执行以下操作: 1. **寻找默认提交按钮**:浏览器会在当前激活的输入元素所在表单内寻找具有`type="submit"`属性的`&lt;button&gt;`或`&lt;input&gt;`元素。如果找到,就会...

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

    1. 添加一个隐藏的文本输入框:在表单中添加一个CSS样式为`display:none`的文本输入框,这样即使用户按下回车,也会因为有多个文本输入框而不会触发提交。例如: ```html &lt;form action="" method="post"&gt; &lt;/form...

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

    当用户在一个输入框中输入文本时,可以通过监听`onkeydown`事件来检查用户是否按下了回车键。如果确实按下了回车键,则模拟点击提交按钮的行为,进而实现表单的自动提交。 ### 2. 兼容性问题及解决方案 在上述代码...

    网页中表单按回车就自动提交的问题的解决方案

    1、当form表单中只有一个&lt;input type=”text” name=...按下回车将不会自动提交,但是页面上显示一个不知所云的输入框挺别扭,后从网上搜到两个解决办法: (1)添加一个 代码如下: &lt;input style=”display: no

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

    但在某些特殊场景下,例如只需要一个输入框的简单搜索功能或快捷操作,直接使用`&lt;form&gt;`标签可能会显得过于繁琐。此时,可以考虑使用JavaScript来实现没有`&lt;form&gt;`表单的情况下的回车键提交功能。 #### 实现原理 ...

    页面只有一个text的时候,回车自动submit的解决方法

    在HTML中,当表单内只有一个输入字段时,按回车键会触发表单的提交事件,即使你已经在文本输入框中绑定了其他事件(如AJAX请求)。这种行为在IE和Firefox等主流浏览器中都是普遍存在的,这源自于浏览器对用户交互的...

    网页 按ctrl+回车提交

    在这个例子中,当用户在输入框中按下Ctrl+Enter时,表单会被提交,而不会引发页面刷新。这就是“网页 按ctrl+回车提交”的基本实现原理。这个功能可以在任何需要提高用户交互效率的表单场景中使用,比如在线聊天、...

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

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

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

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

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

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

    仿百度输入框仿百度输入框

    通常,一个搜索输入框由`&lt;form&gt;`元素包裹,包含一个`&lt;input&gt;`元素用于用户输入,可能还会有一个`&lt;button&gt;`元素作为提交按钮。例如: ```html &lt;form action="data.jsp" method="get"&gt; 请输入关键词"&gt; 搜索 &lt;/form&gt;...

Global site tag (gtag.js) - Google Analytics