input type =text,按回车键自动提交
1、当form表单中只有一个<input type="text" name='name' />时按回车键将会自动将表单提交
<form id='form1' action='a1.jsp' method='post'>
<input type='text' name='name' />
</form>
再添加一个<input type="text"/>按下回车将不会自动提交,但是页面上显示一个不知所云的输入框挺别扭,后从网上搜到两个解决办法:
1;添加一个<input type='text' style='display:none'/>不显示输入框,然后回车之后也不会提交:
<form id='form1' action='a1.jsp' method='post'>
<input type='text' name='name' />
<input style='display:none' />
</form>
2;添加一个onkeydown事件,然后回车之后也不会显示:
<form id='form1' action='a1.jsp' method='post'>
<input type='text' name='name' onkeydown='if(event.keyCode==13) return false;'/>
</form>
如果想添加回车事件可以在onkeydown事件中添加判断提交表单:
<form id='form1' action='a1.jsp' method='post'>
<input style='display:none' />
<input type='text' name='name' onkeydown='if(event.keyCode==13){gosubmit();}' />
</form>
我们有时候希望回车键敲在文本框(input element)里来提交表单(form),但有时候又不希望如此。比如搜索行为,希望输入完关键词之后直接按回车键立即提交表单,而有些复杂表单,可能要避免回车键误操作在未完成表单填写的时候就触发了表单提交。
要控制这些行为,不需要借助JS,浏览器已经帮我们做了这些处理,这里总结几条规则:
如果表单里有一个type=”submit”的按钮,回车键生效。
如果表单里只有一个type=”text”的input,不管按钮是什么type,回车键生效。
如果按钮不是用input,而是用button,并且没有加type,IE下默认为type=button,FX默认为type=submit。
其他表单元素如textarea、select不影响,radio checkbox不影响触发规则,但本身在FX下会响应回车键,在IE下不响应。
type=”image”的input,效果等同于type=”submit”,不知道为什么会设计这样一种type,不推荐使用,应该用CSS添加背景图合适些。
input type =text,按回车键自动提交的更多相关文章
- UC浏览器input文本框输入文字回车键自动提交
这是测试今天在jira给我提出的一个bug 下面是贴的代码 屏蔽或者禁止回车键 <!DOCTYPE html> <html> <head> <meta cha ...
- html设置<input type="text">内的内容自动为大写
添加css样式:text-transform:uppercase;可以实现自动转换为大写样式. 但是input 的value还是小写的,因为它是CSS样式. <input type=" ...
- HTML:<input type="text"> 输入数字时的验证!(在提交时验证)
<!--非负数:<input type="text" name="" pattern="^\d+$">--> < ...
- input type=password 浏览器会自动填充密码的问题
解决办法是在form上或input上添加autoComplete="off"这个属性. form表单的属性如下所示: 但是这个解决方案在谷歌和火狐上均有bug,下面来一个一个解决. ...
- html5与js关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的value点击全选状态onclick="select();"。做购物车页面时会要用到。
关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的点击全选状态onclick="s ...
- JavaScript通过preventDefault()使input[type=text]禁止输入但保留光标
一.说明 取消事件的默认动作. 该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作).例如,如果 type 属性是 "submit",在事件传播的任意阶段 ...
- 对比<input type="text" id="">和<asp:TextBox runat="server" ID="">
首先这两个都是对应文本输入框形式: <input type="text"class="form-control"id="txt_add_pro_ ...
- js让text值不可改变,同<input type="text" readonly="readonly" />
<input type="text" size="60" name="j01" value="www.52jscn.com ...
- chrome下input[type=text]的placeholder不垂直居中的问题解决
http://blog.csdn.net/do_it__/article/details/6789699 <input type="text" placeholder=&qu ...
随机推荐
- iOS 错误:… is being deallocated while key value observing are still registered with it
这个错误从字面上来看就是有一个实例由于被observing而无法被释放. 具体原因可能是该对象添加了一个oberver.所以释放的时候要先取消observer. 具体方法是在 dealloc 方法中: ...
- kolla 安装
下载 kolla-ansible 和 kolla 源码: git clone http://git.trystack.cn/openstack/kolla-ansible -b stable/quee ...
- SpringMVC--视图
本章简介 视图(View)和视图解析器(ViewResolver)的工作流程: 当请求处理方法处理完请求之后,会返回String.ModelAndView或View对象,如return “succes ...
- django使用haystack来调用Elasticsearch搜索引擎
如何使用django来调用Elasticsearch实现全文的搜索 环境:django ==1.11.11 Haystack为Django提供了模块化的搜索.它的特点是统一的,熟悉的API,可以让你在 ...
- 关于IPv4设置一些常见问题的解答
问:为什么要填IP地址.网关.DNS? 如果是单部机拨号上网,是不需要填这些的.不填,或乱填,对上网都没有任何影响.但是在局域网上网(用路由器就属此环境),就一定要正确设置(手工填写或接受自动分配 ...
- 总结day24 ---- socket ,struct 的学习
前情提要 一:套接字 socket() 1:三次握手 1:客户端像服务端链接, (第一次握手) 2:服务端收到请求,告诉客户端服务端收到了内容 (第二次握手1) 3:服务端像客户端连接, ...
- python实现计算器功能
import re def strip_operate(exp): # 合并多余的操作符 exp = exp.replace("+-", "-") exp = ...
- [Re:从零开始的分布式] 0.x——分布式锁概述
为什么需要分布式锁 Martin Kleppmann是英国剑桥大学的分布式系统的研究员,Martin认为一般我们使用分布式锁有两个场景: 效率:使用分布式锁可以避免不同节点重复相同的工作,这些工作会浪 ...
- (转)aix非计算内存 占用过高 案例一则
原文:http://www.talkwithtrend.com/Article/28621 两台小型机组成的RAC环境,在用topas查看资源使用情况时,发现一台机器的非计算内存占用过高: MEMOR ...
- WCF系列教程之WCF客户端异常处理
本文参考自:http://www.cnblogs.com/wangweimutou/p/4414393.html,纯属读书笔记,加深记忆 一.简介 当我们打开WCF基础客户通道,无论是显示打开还是通过 ...