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 相关文章推荐
Javascript根据指定下标或对象删除数组元素
Dec 21 Javascript
js 立即调用的函数表达式如何写
Jan 12 Javascript
JavaScript中window.showModalDialog()用法详解
Dec 18 Javascript
JS实现点击文字对应DIV层不停闪动效果的方法
Mar 02 Javascript
Javascript URI 解析介绍
Mar 15 Javascript
Vue开发中整合axios的文件整理
Apr 29 Javascript
微信小程序实现的涂鸦功能示例【附源码下载】
Jan 12 Javascript
vue 多入口文件搭建 vue多页面搭建的实例讲解
Mar 12 Javascript
微信小程序第三方框架对比 之 wepy / mpvue / taro
Apr 10 Javascript
解决layer.confirm选择完之后消息框不消失的问题
Sep 16 Javascript
Vue 封装防刷新考试倒计时组件的实现
Jun 05 Javascript
分享一个vue实现的记事本功能案例
Apr 11 Vue.js
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
php 无法加载mysql的module的时候的配置的解决方案引发的思考
2012/01/27 PHP
PHP实现克鲁斯卡尔算法实例解析
2014/08/22 PHP
php动态绑定变量的用法
2015/06/16 PHP
WordPress中查询文章的循环Loop结构及用法分析
2015/12/17 PHP
php获取ajax的headers方法与内容实例
2017/12/27 PHP
uploadify 3.0 详细使用说明
2012/06/18 Javascript
js arguments,jcallee caller用法总结
2013/11/30 Javascript
javascript定义类和类的实现实例详解
2015/12/01 Javascript
AngularJS 自定义指令详解及示例代码
2016/08/17 Javascript
JS实现京东首页之页面顶部、Logo和搜索框功能
2017/01/12 Javascript
angular2+nodejs实现图片上传功能
2017/03/27 NodeJs
Bootstrap进度条与AJAX后端数据传递结合使用实例详解
2017/04/23 Javascript
详解cordova打包成webapp的方法
2017/10/18 Javascript
VueX模块的具体使用(小白教程)
2020/06/05 Javascript
Python 流程控制实例代码
2009/09/25 Python
python 遍历字符串(含汉字)实例详解
2017/04/04 Python
Python使用sorted排序的方法小结
2017/07/28 Python
django和vue实现数据交互的方法
2019/08/21 Python
Python *args和**kwargs用法实例解析
2020/03/02 Python
应届生幼儿园求职信
2013/11/12 职场文书
网络事业创业计划书范文
2014/01/09 职场文书
出纳工作岗位责任制
2014/02/02 职场文书
高中打架检讨书
2014/02/13 职场文书
法人代表授权委托书
2014/04/08 职场文书
财务人员担保书
2014/05/13 职场文书
2014年全国法制宣传日宣传活动方案
2014/11/02 职场文书
商场营业员岗位职责
2015/04/14 职场文书
涨价通知怎么写
2015/04/23 职场文书
投资合作意向书范本
2015/05/08 职场文书
结婚幸福感言
2015/08/01 职场文书
保姆聘用合同
2015/09/21 职场文书
承诺书应该怎么写?
2019/09/10 职场文书
解决Mysql多行子查询的使用及空值问题
2022/01/22 MySQL
Java数组详细介绍及相关工具类
2022/04/14 Java/Android
微信小程序APP页面的之间的相互传递参数以及自定义组件
2022/04/19 Javascript
第四次工业革命,打工人与机器人的竞争
2022/04/21 数码科技