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 相关文章推荐
用javascript实现的激活输入框后隐藏初始内容
Jun 29 Javascript
如何获取select下拉框的值(option没有及有value属性)
Nov 08 Javascript
JS实现的文字与图片定时切换效果代码
Oct 06 Javascript
jquery拖动层效果插件用法实例分析(附demo源码)
Apr 28 Javascript
AngularJS 工作原理详解
Aug 18 Javascript
用Webpack构建Vue项目的实践
Nov 07 Javascript
详解vue的数据劫持以及操作数组的坑
Apr 18 Javascript
Vue中jsx不完全应用指南小结
Nov 01 Javascript
ES6常用小技巧总结【去重、交换、合并、反转、迭代、计算等】
Dec 21 Javascript
Vue常用传值方式、父传子、子传父及非父子实例分析
Feb 24 Javascript
原生js实现无缝轮播图效果
Jan 28 Javascript
关于Js中new操作符的作用详解
Feb 21 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
一些星际专用术语解释
2020/03/04 星际争霸
PHP中imagick函数的中文解释
2015/01/21 PHP
php找出指定范围内回文数且平方根也是回文数的方法
2015/03/23 PHP
php获取文件后缀的9种方法
2016/03/22 PHP
php+mongodb判断坐标是否在指定多边形区域内的实例
2016/10/28 PHP
php DES加密算法实例分析
2019/09/18 PHP
php写app用的框架整理
2019/09/29 PHP
laravel邮件发送的实现代码示例
2020/01/31 PHP
PHP获取php,mysql,apche的版本信息及更多服务器信息
2021/03/09 PHP
响应鼠标变换表格背景或者颜色的代码
2009/03/30 Javascript
jQuery1.9.1针对checkbox的调整方法(prop)
2014/05/01 Javascript
checkbox选中与未选中判断示例
2014/08/04 Javascript
5种处理js跨域问题方法汇总
2014/12/04 Javascript
jQuery插件Zclip实现完美兼容个浏览器点击复制内容到剪贴板
2015/04/30 Javascript
jQuery实现商品活动倒计时
2015/10/16 Javascript
jQuery+CSS3折叠卡片式下拉列表框实现效果
2015/11/02 Javascript
详解JavaScript时间格式化
2015/12/23 Javascript
浅谈jQuery中ajaxPrefilter的应用
2016/08/01 Javascript
jquery中关于bind()方法的使用技巧分享
2017/03/30 jQuery
JavaScript简单计算人的年龄示例
2017/04/15 Javascript
bootstrap modal+gridview实现弹出框效果
2017/08/15 Javascript
jQuery动态添加li标签并添加属性和绑定事件方法
2018/02/24 jQuery
Vee-validate 父组件获取子组件表单校验结果的实例代码
2019/05/20 Javascript
Vue函数式组件的应用实例详解
2019/08/30 Javascript
基于Python实现的百度贴吧网络爬虫实例
2015/04/17 Python
Django中对通过测试的用户进行限制访问的方法
2015/07/23 Python
Python Selenium安装及环境配置的实现
2020/03/17 Python
python 实现两个npy档案合并
2020/07/01 Python
python获取时间戳的实现示例(10位和13位)
2020/09/23 Python
python向企业微信发送文字和图片消息的示例
2020/09/28 Python
真正了解CSS3背景下的@font face规则
2017/05/04 HTML / CSS
世界最大的海报和艺术印刷商店:AllPosters.com
2017/02/01 全球购物
解除施工合同协议书
2014/10/17 职场文书
2014年药品销售工作总结
2014/12/16 职场文书
winserver2019安装软件一直卡在应用程序正在为首次使用做准备
2022/06/10 Servers
MySQL数据库之存储过程 procedure
2022/06/16 MySQL