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 相关文章推荐
给moz-firefox下添加IE方法和属性
Apr 10 Javascript
用jquery设置按钮的disabled属性的实现代码
Nov 28 Javascript
jQuery获取浏览器中的分辨率实现代码
Apr 23 Javascript
兼容主流浏览器的JS复制内容到剪贴板
Dec 12 Javascript
node.js中的fs.symlinkSync方法使用说明
Dec 15 Javascript
BootStrap.css 在手机端滑动时右侧出现空白的原因及解决办法
Jun 07 Javascript
bootstrap配合Masonry插件实现瀑布式布局
Jan 18 Javascript
JS实现按钮添加背景音乐示例代码
Oct 17 Javascript
js的对象与函数详解
Jan 21 Javascript
LayUi使用switch开关,动态的去控制它是否被启用的方法
Sep 21 Javascript
js DOM的事件常见操作实例详解
Dec 16 Javascript
js实现点赞按钮功能的实例代码
Mar 06 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
PHP环境搭建最新方法
2006/09/05 PHP
PHP:风雨欲来 路在何方?
2006/10/09 PHP
封装的jquery翻页滚动(示例代码)
2013/11/18 Javascript
Jquery实现侧边栏跟随滚动条固定(兼容IE6)
2014/04/02 Javascript
select多选 multiple的使用示例
2014/06/16 Javascript
angularjs中的单元测试实例
2014/12/06 Javascript
node.js中的buffer.Buffer.byteLength方法使用说明
2014/12/10 Javascript
js图片翻书效果代码分享
2015/08/20 Javascript
深入理解Javascript中的观察者模式
2017/02/20 Javascript
javascript深拷贝的原理与实现方法分析
2017/04/10 Javascript
JavaScript运动框架 解决速度正负取整问题(一)
2017/05/17 Javascript
JS模拟超市简易收银台小程序代码解析
2017/08/18 Javascript
详解PHP后期静态绑定分析与应用
2018/03/21 Javascript
使用node搭建自动发图文微博机器人的方法
2019/03/22 Javascript
解决IOS端微信H5页面软键盘弹起后页面下方留白的问题
2019/06/05 Javascript
vue进入页面时不在顶部,检测滚动返回顶部按钮问题及解决方法
2019/10/30 Javascript
Vue实现购物车基本功能
2020/11/08 Javascript
Python 2.x如何设置命令执行的超时时间实例
2017/10/19 Python
Python爬虫包BeautifulSoup实例(三)
2018/06/17 Python
django框架之cookie/session的使用示例(小结)
2018/10/15 Python
在python中只选取列表中某一纵列的方法
2018/11/28 Python
Python3解释器知识点总结
2019/02/19 Python
利用python将图片版PDF转文字版PDF
2019/05/03 Python
pyqt5 获取显示器的分辨率的方法
2019/06/18 Python
Python 简单计算要求形状面积的实例
2020/01/18 Python
Iconfont(矢量图标)+iconmoon(图标svg互转)配合javascript实现社交分享系统
2020/04/21 Python
基于OpenCV的网络实时视频流传输的实现
2020/11/15 Python
HTML5在微信内置浏览器下右上角菜单的调整字体导致页面显示错乱的问题
2021/01/19 HTML / CSS
英国二手物品交易网站:Preloved
2017/10/06 全球购物
舒适的豪华鞋:Taryn Rose
2018/05/03 全球购物
自动化专业毕业生自荐信
2013/11/01 职场文书
《纸船和风筝》教学反思
2014/02/15 职场文书
学生会副主席竞聘书
2014/03/31 职场文书
学校文明单位申报材料
2014/05/06 职场文书
优秀班主任事迹材料
2014/12/16 职场文书
win10滚动条自动往上跑怎么办?win10滚动条自动往上跑的解决方法
2022/08/05 数码科技