jquery按回车键实现表单提交的简单实例


Posted in Javascript onMay 25, 2016

本文章在给大家介绍在用户输入完信息之后直接按回车进行表单提交的jquery实现方法,有需要了解的朋友可进来参考以。

键盘事件有3:

jquery键盘事件参考:

1、keydown()

keydown事件会在键盘按下时触发.

2、keyup()

keyup事件会在按键释放时触发,也就是你按下键盘起来后的事件

3、keypress()

keypress事件会在敲击按键时触发,我们可以理解为按下并抬起同一个按键

正确代码为:

$(document).keyup(function(event){
 if(event.keyCode ==13){
  $("#submit").trigger("click");
 }
});

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

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

$(window).keydown(function(){
...
})

XP系统IE6下是不成功的。

2.还有INPUT的

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

这种情况要在input获取焦点时候,才能监听到键盘事件。

例表单如下:

<form name="loginform" id="loginform" method="post">
 <div>   
   <p>用户名:<input type="text" name="username" /></p>
   <p>密码:<input type="password" name="password" /></p>
   <p><input type="button" value="" class="log_btn" /></p>
 </div>
</form>

juqery实现方法:

$("#loginform").keydown(function(e){
 var e = e || event,
 keycode = e.which || e.keyCode;
 if (keycode==13) {
 $(".log_btn").trigger("click");
 }
});

以上这篇jquery按回车键实现表单提交的简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Google Map Api和GOOGLE Search Api整合实现代码
Jul 18 Javascript
JavaScript 变量基础知识
Nov 07 Javascript
JS获取url链接字符串 location.href
Dec 23 Javascript
Jquery使用val方法读写value值
May 18 Javascript
JQuery中ajax方法访问web服务实例
Jul 18 Javascript
jquery实现TAB选项卡鼠标经过带延迟效果的方法
Jul 27 Javascript
jquery彩色投票进度条简单实例演示
Jul 23 Javascript
jQuery实现只允许输入数字和小数点的方法
Mar 02 Javascript
javascript 使用正则test( )第一次是 true,第二次是false
Feb 22 Javascript
vue.js从安装到搭建过程详解
Mar 17 Javascript
vue使用Font Awesome的方法步骤
Feb 26 Javascript
微信小程序上传图片并等比列压缩到指定大小的实例代码
Oct 24 Javascript
Javascript之BOM(window对象)详解
May 25 #Javascript
jQueryUI中的datepicker使用方法详解
May 25 #Javascript
jQuery+PHP实现微信转盘抽奖功能的方法
May 25 #Javascript
jQuery获取访问者IP地址的方法(基于新浪API与QQ查询接口)
May 25 #Javascript
JQuery的常用选择器、过滤器、方法全面介绍
May 25 #Javascript
Vue.js报错Failed to resolve filter问题的解决方法
May 25 #Javascript
JavaScript通过HTML的class来获取HTML元素的方法总结
May 24 #Javascript
You might like
使用 PHPMAILER 发送邮件实例应用
2012/11/07 PHP
PHP中对各种加密算法、Hash算法的速度测试对比代码
2014/07/08 PHP
PHP基于yii框架实现生成ICO图标
2015/11/13 PHP
smarty中改进truncate使其支持中文的方法
2016/05/30 PHP
JSON两种结构之对象和数组的理解
2016/07/19 PHP
PHP自定义函数实现数组比较功能示例
2017/10/19 PHP
php设计模式之组合模式实例详解【星际争霸游戏案例】
2020/03/27 PHP
JQuery SELECT单选模拟jQuery.select.js
2009/11/12 Javascript
面向对象Javascript核心支持代码分享
2012/05/23 Javascript
js控制CSS样式属性语法对照表
2012/12/11 Javascript
自动最大化窗口的Javascript代码
2013/05/22 Javascript
原生js页面滚动延迟加载图片
2015/12/20 Javascript
全面理解JavaScript中的闭包
2016/05/12 Javascript
jquery遍历table的tr获取td的值实现方法
2016/05/19 Javascript
jQuery简易时光轴实现方法示例
2017/03/13 Javascript
react.js CMS 删除功能的实现方法
2017/04/17 Javascript
JSON对象转化为字符串详解
2017/08/11 Javascript
js基于FileSaver.js 浏览器导出Excel文件的示例
2017/08/15 Javascript
vue iview组件表格 render函数的使用方法详解
2018/03/15 Javascript
javascript 关于赋值、浅拷贝、深拷贝的个人理解
2019/11/01 Javascript
原生js实现放大镜组件
2021/01/22 Javascript
[40:03]RNG vs VG 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
[01:28:44]DOTA2-DPC中国联赛定级赛 RNG vs iG BO3第一场 1月10日
2021/03/11 DOTA
[03:15]DOTA2-DPC中国联赛1月22日Recap集锦
2021/03/11 DOTA
Python的Flask框架中配置多个子域名的方法讲解
2016/06/07 Python
Python面向对象程序设计多继承和多态用法示例
2019/04/08 Python
使用 Python 处理 JSON 格式的数据
2019/07/22 Python
Python爬虫之Selenium中frame/iframe表单嵌套页面
2020/12/04 Python
python中threading和queue库实现多线程编程
2021/02/06 Python
如何利用input事件来监听移动端的输入
2016/04/15 HTML / CSS
HTML5 video进入全屏和退出全屏的实现方法
2020/07/28 HTML / CSS
法人代表授权委托书
2014/04/08 职场文书
疾病防治方案
2014/05/31 职场文书
团日活动总结报告
2014/06/25 职场文书
2015年第31个教师节致辞
2015/07/31 职场文书
因个人工作失误检讨书
2019/06/21 职场文书