在这里说一说浏览器里form表单的默认行为

我们都知道浏览器是存在很多默认行为的,可能是出于常用行为考虑又或者是历史原因。但有时候我们不需要这些默认行为。以下:

1)、当form表单里只存在一个input输入框时,回车会提交表单操作。

   解决方法可以在form里面再加入一个隐藏的input输入框,或者把input从form里面放出来。

2)、当form表单里有一个type=”submit”的按钮,回车会自动提交。

3)、当form表单里的button按钮没有加type类型时,在ie下默认是button类型,标准浏览器下是submi类型

  最好加上type=button,以保持各浏览器保持一致

4)、 其他表单元素如textarea、select不影响,radio checkbox不影响触发规则,但本身在Firefox下会响应回车键,在IE下不响应。

5)、type=”image”的input,效果等同于type=”submit”,不知道为什么会设计这样一种type,不推荐使用,应该用CSS添加背景图合适些。

<script type="text/javascript">

document.onkeydown=keyDownSearch; 
    function keyDownSearch(e) {  
        // 兼容FF和IE和Opera  
        var theEvent = e || window.event;  
        var code = theEvent.keyCode || theEvent.which || theEvent.charCode;  
        if (code == 13) {   
            DoSomeThing();//具体处理函数  
            return false;  
        }  
        return true;  
    } 
</script>

如果只是针对某个DIV层应用回车查询的话,可以将: 
document.onkeydown=keyDownSearch; 
改成: 
document.getElementById('层ID').onkeydown=keyDownSearch;

form表单里如果只存在一个文本框,enter键提交的更多相关文章

  1. form表单里的button调用js函数

    近来发现一个特别奇怪的问题:在form表单里,button的onclick事件无法调用js函数.代码如下(这段代码放在form标签里): dropUpdateAddress调用的js函数为: 这个时候 ...

  2. 前端笔记:React的form表单全部置空或者某个操作框置空的做法

    1.全部置空的做法,一般在弹出框关闭后,需要重置该form所有表单: this.props.form.resetFields(); 2.针对某个操作框置空的做法 例如,form表单里有一个部门和一个张 ...

  3. form表单元素中disabled的元素的值不会提交到服务器

    1.表单元素中disabled的元素的值不会提交到服务器,后台获取的值为null <form id="myForm" action="#" method= ...

  4. [Swift通天遁地]二、表格表单-(11)创建星期选项表单和拥有浮动标签的文本框

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  5. 标签form表单里的属性简单介绍了一下

    <form id="form1" name="form1" method="post" action=""> ...

  6. form表单里的故事

    <form class="m-t" role="form" action='javascript:;'> <div class="f ...

  7. JS中 submit提交与Form表单里的onsubmit的调用问题?

    最近在开发中遇到了表单提交前验证的问题,用一个普通的button按钮代替submit按钮,在提交前触发这个button的onclick事件,在其事件中触发form的submit事件.问题出现了: &l ...

  8. form表单里的坑

    我们在写前端表单页面的时候,为了更好的SEO,我们会使用form标签,但是我们经常的情况是:我们并不需要form标签的一些默认事件,比如: 1.form内只有一个input标签的话,回车会触发表单的提 ...

  9. 遇到问题-----JS中设置window.location.href跳转无效(在a标签里或这form表单里)

    问题情况 JS中设置window.location.href跳转无效 代码如下: ? 1 2 3 4 5 6 7 8 <script type="text/javascript&quo ...

随机推荐

  1. 利用MyEclipse自动生成POJO和配置文件

    1.选择MyEclipse菜单的window菜单的Open Perspective,选择MyEclipse Database Explorer,如图所示. 2.在MySql上面点击右键,选择eidt. ...

  2. 【小错误】ORA-00265: instance recovery required, cannot set ARCHIVELOG mode

    1.错误描述:今天在起归档的时候报一下错误: SQL> alter database archivelog; alter database archivelog * ERROR at line ...

  3. oracle查询中文数据出现乱码

    首先,在oracle中,输入select userenv('language') from dual,查询出oracle使用的编码方式,我的是SIMPLIFIED CHINESE_CHINA.ZHS1 ...

  4. Markdown写博客

    一级目录 我接下来是不是该写二级目录了 二级目录 如果我用桌面端的Markdown会不会好很多,这个我看不到效果 听说插入表格很麻烦? 列表是这样的? 我还看不出样子 *这个是什么样子啊 引用是这样用 ...

  5. THINKPHP中关于接口问题(客户端)

    一 apk版本号 客户端发送get请求访问服务器端的控制器方法,通过用户传过来的用户名和密码. 二  服务器端通过客户端传入的user and password 去数据库进行查询,Success就生成 ...

  6. BIO,NIO,AIO

    同步阻塞IO(JAVA BIO):     同步并阻塞,服务器实现模式为一个连接一个线程,即客户端有连接请求时服务器端就需要启动一个线程进行处理,如果这个连接不做任何事情会造成不必要的线程开销,当然可 ...

  7. CXF发布webService服务以及客户端调用

    这篇随笔内容是CXF发布webService服务以及客户端调用的方法 CXF是什么? 开发工作之前需要下载CXF和安装 下载地址:http://cxf.apache.org 安装过程: <1&g ...

  8. rabbitmq 学习足迹

    http://www.cnblogs.com/me-sa/archive/2012/10/20/RabbitMQ_VHost_Exchanges_queues_bindings_and_Channel ...

  9. app 支付宝 支付 alipaySdk

    function pay(P1: JString; P2: Boolean): JString; cdecl;    function fetchOrderInfoFromH5PayUrl(P1: J ...

  10. Kafka报错-as it has seen zxid 0x83808 our last zxid is 0x0 client must try another server

    as it has seen zxid 0x83808 our last zxid is 0x0 client must try another server 停止zookeeper,删除datadi ...