Jquery响应回车键直接提交表单操作代码


Posted in Javascript onJuly 25, 2014

事情是这样的,做了一个登陆页面,把 Form 去了,直接拿 Jquery 的 Ajax 跟服务器交互,但是这样的话 浏览器就不会默认响应 回车键提交数据了。索性让 Jquery 也接管 回车键的响应吧:

$("#loginbox input[type='submit']").click(function() {

    //Ajax 与服务器交互验证

});

$('#loginbox').keydown(function(e){

    if(e.keyCode == 13){

        //模拟点击登陆按钮,触发上面的 Click 事件

        $("#loginbox input[type='submit']").click();

    }

});

如果使用keydown的话,IE6可能无效,解决方法请接着往下看

键盘事件有3:

keydown,keypress,keyup,分别是按下,按着没上抬,上抬键盘 。

正确代码为:

$(document).keyup(function(event){

  if(event.keyCode ==13){

    $("#submit").trigger("click");

  }

});

推荐:keyup,防止笔记本键盘不小心触摸到了

1.有些文档中有写成这样:

$(window).keydown(function(){

...

})

XP系统IE6下是不成功的。

2.还有INPUT的

$("input").keydown(function(){

...

})

这种情况要在input获取焦点时候,才能监听到键盘事件。
Javascript 相关文章推荐
一实用的实现table排序的Javascript类库
Sep 12 Javascript
使用jquery获取网页中图片高度的两种方法
Sep 26 Javascript
js 操作select与option(示例讲解)
Dec 20 Javascript
点击标签切换和自动切换DIV选项卡
Aug 10 Javascript
jQuery插件datepicker 日期连续选择
Jun 12 Javascript
Underscore.js 1.3.3 中文注释翻译说明
Jun 25 Javascript
深入理解Ajax的get和post请求
Jun 02 Javascript
bootstrap daterangepicker双日历时间段选择控件详解
Jun 15 Javascript
Angularjs中ng-repeat的简单实例
Aug 25 Javascript
解决node-sass偶尔安装失败的方法小结
Dec 05 Javascript
微信小程序实现蒙版弹出窗功能
Sep 17 Javascript
基于Cesium绘制抛物弧线
Nov 18 Javascript
Jquery选择器中使用变量实现动态选择例子
Jul 25 #Javascript
jquery阻止后续事件只执行第一个事件
Jul 24 #Javascript
js星星评分效果
Jul 24 #Javascript
jquery实现的鼠标下拉滚动置顶效果
Jul 24 #Javascript
js创建对象的区别示例介绍
Jul 24 #Javascript
点击表单提交时出现jQuery没有权限的解决方法
Jul 23 #Javascript
Extjs根据条件设置表格某行背景色示例
Jul 23 #Javascript
You might like
PHP的伪随机数与真随机数详解
2015/05/27 PHP
PHP微信开发用Cache 解决数据缓存
2016/07/11 PHP
浅谈PHP的排列组合(如输入a,b,c 输出他们的全部组合)
2017/03/14 PHP
自己的js工具_Form 封装
2009/08/21 Javascript
让IE8支持DOM 2(不用框架!)
2009/12/31 Javascript
IE8 中使用加速器(Activities)
2010/05/14 Javascript
用于节点操作的API,颠覆原生操作HTML DOM节点的API
2010/12/11 Javascript
基于jquery的监控数据是否发生改变
2011/04/11 Javascript
javascript实现div的拖动并调整大小类似qq空间个性编辑模块
2012/12/12 Javascript
javascript 利用Image对象实现的埋点(某处的点击数)统计
2012/12/28 Javascript
jQuery1.9.1针对checkbox的调整方法(prop)
2014/05/01 Javascript
用JavaScript实现使用鼠标画线的示例代码
2014/08/19 Javascript
jquery中post方法用法实例
2014/10/21 Javascript
javascript每日必学之运算符
2016/02/16 Javascript
详谈js对url进行编码和解码(三种方式的区别)
2017/08/16 Javascript
JavaScript编程设计模式之观察者模式(Observer Pattern)实例详解
2017/10/25 Javascript
JavaScript基础心法 深浅拷贝(浅拷贝和深拷贝)
2018/03/05 Javascript
vue弹窗组件的实现示例代码
2018/09/10 Javascript
es6数据变更同步到视图层的方法
2019/03/04 Javascript
JavaScript判断浏览器版本的方法
2019/11/03 Javascript
Python完全新手教程
2007/02/08 Python
详解Python最长公共子串和最长公共子序列的实现
2018/07/07 Python
Selenium元素的常用操作方法分析
2018/08/10 Python
Python 使用指定的网卡发送HTTP请求的实例
2019/08/21 Python
详解Python GUI编程之PyQt5入门到实战
2020/12/10 Python
Django2.1.7 查询数据返回json格式的实现
2020/12/29 Python
CSS3实现线性渐变用法示例代码详解
2020/08/07 HTML / CSS
日本网路线上商品代购服务:转送JAPAN
2016/08/05 全球购物
世界上最大的二手相机店:KEN
2017/05/17 全球购物
2014年元旦感言
2014/03/06 职场文书
电子专业求职信
2014/06/19 职场文书
运动会铅球比赛加油稿
2014/09/26 职场文书
住房抵押登记委托书
2014/09/27 职场文书
四风问题对照检查材料思想汇报
2014/10/07 职场文书
商业计划书如何写?关键问题有哪些?
2019/07/11 职场文书
高性能跳频抗干扰宽带自组网电台
2022/02/18 无线电