现象:

  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. 1.2.1 Maven到底是什么鬼

    解释之前,提1个小问题. 1.1.假如你正在Eclipse下开发两个Java项目,姑且把它们称为A.B,其中A项目中的一些功能依赖于B项目中的某些类,那么如何维系这种依赖关系的呢? 很简单,这不就是跟 ...

  2. 查看进程CPU、内存使用情况

    本文介绍通过ps和top查看进程的cpu.内存等使用情况. 1.ps命令 1.1 概览 ps命令相关参数定义: -e 或者-A,选择所有的进程: -L 显示线程: -o 自定义输出格式: 输出格式: ...

  3. ORACLE官方全托管驱动 Oracle.ManagedDataAccess 12.1.0.1.0

    以前用Oracle的时候,必须得装他臃肿的客户端,网上虽然也有提供直连Oracle的驱动,但也是要收费的,最近Oracle终于开窍了,提供了官方的全托管驱动. 这次是随Oracle ODAC 12c  ...

  4. 编辑器UEditor入门学习

    优点:非常使用的富文本编辑器,对比于之前使用的summernote,比前者多出了更多的字体图标 废话少说,直接步骤: 1.导入资源(全部放在单独的文件下即可,下图为“UEditor”文件夹) 2.引用 ...

  5. Java学习之==>泛型

    一.什么是泛型 泛型,即“参数化类型”,在不创建新的类型的情况下,通过泛型指定的不同类型来控制形参具体限制的类型.也就是说在泛型使用过程中,操作的数据类型被指定为一个参数,这种参数类型可以用在类.接口 ...

  6. cocos2dx[3.2](1) 浅析cocos2dx3.2引擎目录

    3.x的引擎目录与2.x的引擎目录的差别是非常大的.3.x主要是将引擎的各个文件按照用途进行了分类,使得引擎目录结构更加清晰了. 从目录中我们主要了解一下以下几个文件: 文件名 说明 build 官方 ...

  7. 转·带你用实例理解C语言回调函数

    原文出处:https://segmentfault.com/a/1190000008293902?utm_source=tag-newest 前言: 如不懂函数指针,请先查阅关于函数指针内容的资料(h ...

  8. [IJCAI-17 口碑商家客流量预测]

    IJCAI-17 口碑商家客流量预测               第 1 赛季截止日期        2017/03/14 赛制介绍 重要时间2月8日 08:00: 评测启动3月7日 10:00: 报 ...

  9. USACO3.3 Home on the Range【思维】

    做完之后看到题解里面很多bfs,dfs,甚至还有dp? 写了一个不知道怎么称呼它的方法,暂且叫他乱搞吧. 用数组a[][]预处理出以当前行作为最底层,这一列从上往下的最长的1的长度. 如果这个格子为0 ...

  10. 在redis里面使用lua

    Redis从2.6版本开始引入对Lua脚本的支持,通过在服务器中嵌入Lua环境,Redis客户端可以使用Lua脚本,直接在服务端原子的执行多个Redis命令. lua脚本的好处: 减少网络开销.可以将 ...