今天在做我的一个小玩意 在线聊天工具的时候

form表单只有一个text和一个button每当我键入enter的时候就刷新。很是郁闷,直接在form上onsumbit=false。才行。

下面是我查询到的结果。

1.form表单回车后自动提交总结

默认情况下,一个文本框的时候,提交,不管按钮type是submit还是button

一个文本框的时候怎么才能做到不提交,方法是加一个隐藏掉的文本框

只要有type为submit的按钮存在,一个文本框还是多个文本框都提交

多个文本框的时候,不提交,用type为button的按钮就行啦

用button元素时,FX和IE下有不同的表现

radio和checkbox在FX下也会触发提交表单,在IE下不会

type为image的按钮,等同于type为submit的效 果

2. 如果 onsubmit 句柄返回 fasle,表单的元素就不会提交。如果该函数返回其他值或什么都没有返回,则表单会被提交。

由于 onsubmit 句柄可以取消表单的提交,所以它对于进行表单验证是十分理想的;

这样的话,修改form的onsubmit事件可以让敲入回车的时候执行我们想要的操作而不跳转到action所指定的url,如下:

<form action="myurl" onSubmit="fun1();return false;">

执行fun1后不会跳转,方便表单操作

3.使用onkeydown事件,如下:

<input type="text"  onkeydown="if(event.keyCode==13){fun1();}"/>

这样在文本输入框内输入文字后直接敲击回车,也会执行fun1函数

有个疑问问下大家,onkeydown事件能为form或者div这样的元素注册吗,比如说

<div onkeydown=" if(event.keyCode==13){fun1();} "></div>

就是希望在焦点在div层的任何一个地方的时候,敲击回车活也执行fun1,而不是非要焦点在文本输入框的时候敲击回车才去执行fun1,那位清楚的探讨下,我试了下貌似不行

如何让form表单在enter键入时不提交的更多相关文章

  1. form表单按enter键自动提交的问题

    废话不多说.直接上代码. 1:form表单按enter键自动提交的情况 <!doctype html> <html lang="en"> <head& ...

  2. form表单的enter自动提交

    当form中只有一个文本框时并且获得焦点 按enter时,就会自动提交表单.阻止自动提交 可以添加一个隐藏的input框 <input type="text" style=& ...

  3. form表单回车Enter不直接提交,类似tab切换

    <input> 控件增加onkeypress事件 onkeypress="return handleEnter(this, event)" JS如下: var keyC ...

  4. 【jQuery】将form表单通过ajax实现无刷新提交

    //将form转换为AJAX提交 function ajaxSubmit(url,frm,fn){ var dataPara=getFormJson(frm); $.ajax({ url:url, t ...

  5. html form表单追加input元素后在提交

    form.append(input); //input为对象 (设置name和val有效) $("#form1").submit();//提交事件

  6. form表单 ----在路上(15)

    form 表单就是将用户的信息提交到服务器,服务器会将信息存储活着根据信息查询数据进行增删改查,再将其返回给用户. 基本格式: <form action="" method ...

  7. form表单取消按钮自动提交

    默认写在form表单里的按钮可以自动提交表单,现在要实现的效果是点击button按钮调用js函数,再有ajax提交 <button type="button" class=& ...

  8. js阻止form表单重复提交

    防止表单重复提交的方法总体来说有两种,一种是在js中阻止重复提交:另一种是在后台利用token令牌实现,大致思路是生成一个随机码放到session和form表单的隐藏输入框中,提交表单时两者对比,表单 ...

  9. 项目回顾1-图片上传-form表单还是base64-前端图片压缩

    第一个项目终于上线了,是一个叫亲青筹的公益众筹平台,微信端,电脑端还有后台界面大部分都是我完成的,几个月过来,感觉收获了很多,觉得要总结一下. 首先想到的是图片上传的问题.在通常表单数据都是ajax上 ...

随机推荐

  1. Dubbo相关博文整理

    configServer配置中心在dubbo client和 dubbo server之间的作用 http://www.cnblogs.com/dengzy/p/5677531.html dubbo ...

  2. jQuery(八):属性操作

    一.获取或设置元素的属性值 attr()获取或设置匹配元素的属性值,语法如下: 获取元素属性值示例: <!DOCTYPE html> <html lang="en" ...

  3. 《快学 Go 语言》第 16 课 —— 包管理 GOPATH 和 Vendor

    到目前位置我们一直在编写单文件代码,只有一个 main.go 文件.本节我们要开始朝完整的项目结构迈进,需要使用 Go 语言的模块管理功能来组织很多的代码文件. 细数 Go 语言的历史发展,模块管理经 ...

  4. Matlab——plot polyfit polyval

    p=polyfit(x,y,m) 其中, x, y为已知数据点向量, 分别表示横,纵坐标, m为拟合多项式的次数, 结果返回m次拟合多项式系数, 从高次到低次存放在向量p中. y0=polyval(p ...

  5. javascript弹层

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. 数据表记录包含表索引和数值,请对表索引相同的记录进行合并,即将相同索引的数值进行求和运算,输出按照key值升序进行输出。

    题目描述 数据表记录包含表索引和数值,请对表索引相同的记录进行合并,即将相同索引的数值进行求和运算,输出按照key值升序进行输出. 输入描述: 先输入键值对的个数然后输入成对的index和value值 ...

  7. MySql避免重复插入记录的几种方法

    本文章来给大家提供三种在mysql中避免重复插入记录方法,主要是讲到了ignore,Replace,ON DUPLICATE KEY UPDATE三种方法,有需要的朋友可以参考一下 方案一:使用ign ...

  8. JAXB解析xml

    废话不多说,直接上代码 核心类: package com.jaxb; import java.io.File; import java.io.FileInputStream; import java. ...

  9. 【吉比特】G-bits2018校园春季招聘技术类岗位笔试经验

    笔试公司:厦门吉比特网络技术股份有限公司 笔试岗位:游戏研发工程师 笔试时间:2018年3月30日19:00-20:30 笔试形式:牛客网在线做题 笔试回忆: 笔试总共时长1小时半,共52道题.其中选 ...

  10. Android开发之旅(二)服务生命周期和广播接收者生命周期

    引言 应用程序组件有一个生命周期——一开始Android实例化他们响应意图,直到结束实例被销毁.在这期间,他们有时候处于激活状态,有时候处于非激活状态:对于活动,对用户有时候可见,有时候不可见.组件生 ...