解决form表单中只有一个文本框时回车提交的问题

最新推荐文章于 2024-11-28 09:46:01 发布
最新推荐文章于 2024-11-28 09:46:01 发布 · 131 阅读 · 0
收录于
Dev Error

当前文章被收录于：

Dev Error
41 篇文章 0 人学习
订阅专栏 查看详情
本文介绍了解决form表单中仅有一个text文本框时，敲击回车自动提交的问题。通过添加隐藏的文本框来阻止默认行为。
在form表单中如果只有一个text文本框时,在上面敲回车时,就会自动提交.要解决这个问题可以
再增加一个text文本框,并将其样式设置为隐藏,即可：

<input style="display:none">
当form表单中只有一个input文本框，会自动提交
dianleichai2987的博客
09-23 550
当form表单中只有一个input文本框，焦点在input中点击键盘上的enter则会直接提交表单，有的时候会带来一些麻烦，这个时候需要禁用这个默认特性， 只需给这个input绑定一个keypress事件，然后监测enter键被按下时，return false 例如： $("input[name=textContent]").key...
当form表单域中只有一个input的时候，默认按回车提交
Hgh_1997的博客
09-28 359
&lt;form @submit.prevent="addText"&gt; &lt;!-- @submit.prevent当表单中只有一个input的时候默认的是回车按键 --&gt; &lt;input class="new-todo" placeholder="What needs to be done?" autofocus v-model="newtext"&gt;
当只有一个input的时候按回车键时，input会默认提交表单
热门推荐
09-03 1万+
原本笔者是想练习一下输入提示这个功能的，在写这个小例子的时候确发现了一个很奇怪的事，如下： 我是想实现如下图的功能： 在输入框输入字符，匹配显示包含输入字符的记录，按上下键可以从结果中选择，本想在结果上点击回车键就选中此记录的，但在只有一个的情况下按下回车键居然会直接提交表单了，笔者水平有限，知其然而不知其所以然，只知道如果加多一个标记就不会提交表单，这里希望得到高手们的详细解释。
form内只有一个输入框时,按回车会自动提交
码疯的专栏
01-26 4377
       昨天碰到一个问题，一个新增页面,本来我的提交按钮是button类型的, 当我输完名称的时候,随手按了个回车,发现表单自动提交了,而其他页面也是这么写的，都没这个问题。这样一来,页面上js的sub()方法里的操作都不起作用。      后来发现这个页面与其他页面唯一的不同是，只有一个名称是输入框,其他的是下拉选择框,问题就是出在这里， 如果form表单内只有一个输入框时,按回车会自
解决form表单中只有一个文本框时回车提交的问题.
莫生气--拒绝空谈，开始行动
03-14 264
在form表单中如果只有一个text文本框时,在上面敲回车时,就会自动提交.要解决这个问题可以 再增加一个text文本框,并将其样式设置为隐藏,即可.
vue中按回车时刷新页面问题
最新发布
加油啊，为了每一天。
11-28 738
经查阅资料得知原因，在当前页面元素中只有一个文本框时，点击回车时会自动提交表单；点击回车按钮后不仅页面会刷新，并且路由多了一个问号。
【bug】表单提交
spirit_peri的博客
09-22 241
问题描述：在提交某项业务时，需要输入一次密码，点击下方确定后提交，但是当el-input有焦点时，按下回车会发生页面刷新事件，url中的参数也被清空。 搜索了问题触发原因，是由于当表单只有一个文本框时，按下回车将会触发表单的提交事件， 导致页面的刷新。 在el-from 加上 @submit.native.prevent阻止默认提交 ...
input回车事件未实现但页面刷新
anvz90795的博客
11-27 190
input文本框外有form标签，当form下只有一个input文本框时回车自动提交表单解决办法：1、去掉form。2、在form下加一个隐藏的input。 (<input id='hiddeninput' type="hidden" style="display:none" />)3、form 加onsubmit 事件，返回 false。 (<form method...
form表单中只有一个input时，按回车键后表单自动提交(form表单的一个小坑)
Hurricane_m的博客
05-27 1337
最近在给公司改项目时发现一个问题，按钮绑定回车事件后按回车表单执行js方法后表单自动提交刷新，先执行了js的方法后自动提交表单，使它相当于没有执行js方法，查阅资料得知在一个form表单中，若只有一个input，按回车键表单会自动提交，但是当表单中存在多个input时，按回车键不会执行任何操作，这是form表单的一个特性。 解决这个问题有四种方法，如下： 第一种方法，把表单去掉，这是最管用，但...
form 表单只有一个input 时，回车自动提交表单造成页面刷新效果
qq_39706777的博客
02-03 2209
el-form 中仅有一个input，input上设置了回车响应事件，首次按回车键后，页面刷新，再次按回车才执行了响应事件
解决form表单提交刷新问题
sunlizhen的专栏
01-17 7628
vue + element ui 阻止表单输入框回车刷新页面 如果button不设置 type='button' 问题 　　在 vue+element ui 中只有一个输入框（el-input）的情况下，回车会提交表单。 解决方案 　　在 el-form 上加上 @submit.native.prevent 这个则会阻止表单回车提交。 测试 下面的代码出现表单回车提交 &lt;...
form表单按enter键自动提交的问题
极客神殿
04-18 4825
1：form表单按enter键自动提交的情况 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""...
通过回车键提交form表单时需要注意的问题
一行代码
01-10 1961
现在很多网站的登陆页面，在输入完账号密码后，点击回车键直接登陆的操作，就是这么一个平凡的操作，不知道大家有没有在实际工作中发现一些问题，下面我来跟大家讲讲我发现的问题，首先运行下面的代码： &lt;form method="get"&gt; &lt;label&gt; 用户名:&lt;input type="text" /&gt; &lt;/label&gt; &lt;button on
html 回车事件 form表单回车提交
test
10-28 3650
第一种： https://zhidao.baidu.com/question/145395482.html 针对整个页面，body中监听回车事件，监听到回车键操作(键盘回车键按下事件的反馈值为13)则执行对应的操作： <!DOCTYPE html> <html lang="zh" xmlns:th="http://www.thymeleaf.org"> <h...
Form表单 回车(Enter)提交表单问题
qq_37609418的博客
06-15 8940
在Form表单中input会自动响应回车事件。这是表单的默认提交动作。表单的提交行为，可以用两种方式定义，一是form表单自身，二是form表单的button元素(包括type='submit’的input标签，以及type=‘submit’的button元素，button元素type为Submit)。而点击Enter键会触发form表单提交。这被称为隐式提交，如果要阻止回车键提交表单，可以在form标签内添加如下代码 ng-keydown 指令不会覆盖元素的原生 onkeydown 事件, 事件触发时，n
Form表单input文本输入框回车键提交问题
weixin_44549995的博客
06-09 1277
Form表单input文本输入框回车键提交问题 当Form表单只有一个inupt文本输入框时，那个文本输入框存在着回车键按下提交from表单事件 而往往我们在使用from表单时为了方便一般都会在输入完文本框后进行给文本框添加键盘事件 一般都是回车键按下或弹起调用方法而当我们在布局form表单时只有一个文本框时他的回车键就会 触发form表单提交从而使你给回车键添加事件会无效果这会让我们遇到无法添加...
当form表单中只有一个input时按回车键将会自动将表单提交
01-09 167
一个列表界面只有一个输入框查询条件，当首次进入在输入框中输入汉字后，按回车键发现输入框中汉字变成乱码！本以为一个很简单不过的问题，结果却花了好久才找到原因（据说是浏览器问题），按回车后执行了两次查询。 1、未修改前代码： <form id="ff" name="ff" method...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值