现象:

  form表单,输入框聚焦后,回车,页面刷新跳转。

原因:

  form表单,在只有一个输入框的时候,在点击回车时,就会触发表单的提交,而form若没有url,则提交后就会刷新页面,导致跳转。

解决:

  1.禁用document的回车事件

在不知道原因的情况下,可以直接禁用document的回车事件。

function document.onkeydown() {
var e = event.srcElement;
if (event.keyCode == 13) {
return false;
}
}

  2.禁用该输入框的回车事件

禁用该输入框的回车事件。

<input type="text"  οnkeydοwn="return ClearSubmit(event)" />
function ClearSubmit(e) {
if (e.keyCode == 13) {
return false;
}
}

  3.隐藏输入框

知道原因后,可以采用增加一个隐藏输入框的方法,避免回车提交。

 <input id="hiddenText" type="text" style="display:none" />

关于form表单回车自动刷新的更多相关文章

  1. 【记录】解决前端form表单回车禁止刷新页面

    最近弄前端 有form表单的情况下 按回车会自动刷新当前页面. 现记录解决方案如下: 1.去掉表单 2.不要让表单中只有一个文本框(增加一个隐藏的文本框就行) 3.以上两点都不想使用,那么就还可以在表 ...

  2. form表单提交不刷新页面的方法

    方法1:给form表单加onsubmit事件,值为return false; <form action="" method="post"  onsubmi ...

  3. Form表单(回车)提交问题

    我们有时候希望回车键敲在文本框(input element)里来提交表单(form),但有时候又不希望如此.比如搜索行为,希望输入完关键词之后直接按回车键立即提交表单,而有些复杂表单,可能要避免回车键 ...

  4. form表单回车提交

    当form中只有一个input[type="text"](其他的表单元素可以随意有)的输入框时候,当input[type="text"]获得焦点的时候,无论表单 ...

  5. form表单回车提交问题,JS监听回车事件

    我们有时候希望回车键敲在文本框(input element)里来提交表单(form),但有时候又不希望如此.比如搜索行为,希望输入完关键词之后直接按回车键立即提交表单,而有些复杂表单,可能要避免回车键 ...

  6. from 表单回车自动提交

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

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

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

  8. 循序渐进PYTHON3(十三) --2-- DJANGO之FORM表单(自动生成HTML标签和自定制提示信息)

    在上一次的代码上做出进一步修改,使之能在页面上显示自定制的报错信息,并且使用form自动创建标签的功能. views.py from django.shortcuts import render,Ht ...

  9. HTML form表单回车触发提交

    <script type="text/javascript">    function submitByEnter()    {        if(event.key ...

随机推荐

  1. 4. 获取当前的文件夹的路径,以及当前文件名的路径 os.path.realpath

    使用os.path.realpath(__file__) 获得当前的文件夹的路径名, 使用os.path.split 进行路径切割 import os src, _= os.path.split(os ...

  2. DAY 5模拟赛

    DAY 5 廖俊豪神仙出题 T1 最小差异矩阵(a.cpp, a.in, a.out) [题目描述] 有一个 n*m 的矩阵,矩阵的每个位置上可以放置一个数.对于第 i 行,第 i 行的差异定义为该行 ...

  3. CountDownLatch用法实践

    项目中写多线程时,需要判断所有线程是否执行完毕,所以想到了添加累加器来判断.这个累加器使用什么变量,找到了以下2种方式. 1. 类似AtomicInteger这种提供原子操作的类型AtomicInte ...

  4. Libvirt 版本降级过程记录 4.5.0 to 3.9.0

    前言 搞 OpenStack 开发 Libvirt 版本会随着 OpenStack 版本切来切去的,记录一下 Libvirt 从 4.5 降级到 3.9.0 的过程. 步骤 直接 downgrade ...

  5. java:Oracle(视图,索引,序列)

    1.索引:索引一共分为4种 -- 在oracle中, -- normal:普通索引 -- unique:唯一索引 -- bitmap:位图索引 -- B 树索引:默认:如果不建立索引的情况下,orac ...

  6. MySQL改密

    一.未进入之前: 1.grep password /var/log/mysqld.log   得出默认密码2.更改密码    mysqladmin -uroot -p'd-tlbwIgP3e2' pa ...

  7. Java 8中处理集合的优雅姿势——Stream

    在Java中,集合和数组是我们经常会用到的数据结构,需要经常对他们做增.删.改.查.聚合.统计.过滤等操作.相比之下,关系型数据库中也同样有这些操作,但是在Java 8之前,集合和数组的处理并不是很便 ...

  8. 【LeetCode】309、最佳买卖股票时机含冷冻期

    Best Time to Buy and Sell Stock with Cooldown 题目等级:Medium 题目描述: Say you have an array for which the ...

  9. 【VS开发】【Qt开发】使用process explorer查看exe调用dll的情况

    打开process explorer 选中想要查看句柄或者加载的dll的进程,比如下面截图红框中的 chrome.exe 菜单点击view / Lower Pane View,其下有DLLS和Hand ...

  10. TP5报错Fatal error: require(): Failed opening required '/home/www/xx/public/../thinkphp/start.php

    https://jingyan.baidu.com/article/afd8f4deb784fe34e386e97b.html https://www.cnblogs.com/300js/p/9224 ...