jquery 回车事件实现代码


Posted in Javascript onAugust 23, 2011

例子,jquery键盘事件、回车键事件用法。

// 键盘事件
1、keydown() 
keydown事件会在键盘按下时触发. 

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

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

// 回车键事件 
// 绑定键盘按下事件  
   $(document).keypress(function(e) {  
    // 回车键事件  
       if(e.which == 13) {  
   jQuery(".confirmButton").click();  
       }  
   }); 
// 上下键事件 
$(document).keydown(function(event){  
  //判断当event.keyCode 为37时(即左方面键),执行函数to_left();  
  //判断当event.keyCode 为39时(即右方面键),执行函数to_right();    if(event.keyCode == 37){  
     to_left();   
  }else if (event.keyCode == 39){   
     to_right();   
  }   
});

说明:由于浏览器键盘按下事件的不同,可能导致部分事件不能正常操作,所以推荐keydown事件进行操作!

Jquery 监视按键,按下回车键触发某方法
<script type="text/javascript"> 
$(function () { 
$('input:text:first').focus(); //把焦点放在第一个文本框 
var $inp = $('input'); //所有的input元素 
$inp.keypress(function (e) { //这里给function一个事件参数命名为e,叫event也行,随意的,e就是IE窗口发生的事件。 
var key = e.which; //e.which是按键的值 
if (key == 13) { 
alert("aaa"); 
} 
}); 
});

问题:
拖了一个Login控件,然后给它转化为template,用于自定义开发。

jquery 回车事件实现代码

下面的代码中,我捕捉到了文本栏的回车按键,这时我要去触发LoginButton来提交登录信息进行验证,可是我使用$("[id$=LoginButton]").click();只在firefox上有效,在IE无效,歪打正着的尝试一下$("[id$=LoginButton]").focus();  ,这个可以在IE上起效,在IE上focus()即完成了对焦又执行了点击,不解啊。呵呵~

$inp.keypress(function (event) {
    var key = event.which;
    if (key == 13) {
        $("[id$=LoginButton]").click(); //支持firefox,IE武校
        //$('input:last').focus();
        $("[id$=LoginButton]").focus();  //支持IE,firefox无效。
//以上两句实现既支持IE也支持 firefox
    }
});

代码如下:

全局:

$(function(){ 
document.onkeydown = function(e){ 
var ev = document.all ? window.event : e; 
if(ev.keyCode==13) { 
$('#FormId).submit();//处理事件 
} 
} 
});

某个控件:
$('#id').keydown(function(e){ 
if(e.keyCode==13){ 
$('#FormId).submit(); //处理事件 
} 
});

if (window.event.keyCode==13) window.event.keyCode=0

//这样就取消回车键了
如果想模拟Tab键,只要写成  if (window.event.keyCode==13) window.event.keyCode=9 就行了,它会跳到另一个元素上。

Javascript 相关文章推荐
Dom加载让图片加载完再执行的脚本代码
May 15 Javascript
JavaScript实现网页上的浮动广告的简单方法
Jun 14 Javascript
javascript loadScript异步加载脚本示例讲解
Nov 14 Javascript
javascript常见操作汇总
Sep 03 Javascript
js实现跨域的方法实例详解
Jun 24 Javascript
JavaScript Math 对象常用方法总结
Apr 28 Javascript
jQuery选择器之表单元素选择器详解
Sep 19 jQuery
原生JS封装animate运动框架的实例
Oct 12 Javascript
jQuery实现的老虎机跑动效果示例
Dec 29 jQuery
js计算最大公约数和最小公倍数代码实例
Sep 11 Javascript
JS Ajax请求会话过期处理问题解决方法分析
Nov 16 Javascript
原生js实现随机点餐效果
Dec 10 Javascript
基于jquery的大众点评,分类导航实现代码
Aug 23 #Javascript
20个非常棒的 jQuery 幻灯片插件和教程分享
Aug 23 #Javascript
基于jquery实现的鼠标拖拽元素复制并写入效果
Aug 23 #Javascript
一些有用的JavaScript和jQuery的片段分享
Aug 23 #Javascript
Fastest way to build an HTML string(拼装html字符串的最快方法)
Aug 20 #Javascript
jQuery最佳实践完整篇
Aug 20 #Javascript
jQuery的deferred对象使用详解
Aug 20 #Javascript
You might like
PHILIPS L4X25T电路分析和打理
2021/03/02 无线电
让你成为更出色的PHP开发者的10个技巧
2011/02/25 PHP
PHP json格式和js json格式 js跨域调用实现代码
2012/09/08 PHP
php 利用array_slice函数获取随机数组或前几条数据
2015/09/30 PHP
Yii2验证器(Validator)用法分析
2016/07/23 PHP
PJBlog插件 防刷新的在线播放器
2006/10/25 Javascript
IE下js调试工具Companion.JS
2010/10/15 Javascript
jquery中的事件处理详细介绍
2013/06/24 Javascript
JavaScript拆分字符串时产生空字符的解决方案
2014/09/26 Javascript
初识Node.js
2015/03/20 Javascript
BootstrapValidator超详细教程(推荐)
2016/12/07 Javascript
JavaScript正则表达式简单实用实例
2017/06/23 Javascript
vue路由嵌套的SPA实现步骤
2017/11/06 Javascript
vue2.0项目实现路由跳转的方法详解
2018/06/21 Javascript
Angular6 Filter实现页面搜索的示例代码
2018/12/02 Javascript
vue-cli 目录结构详细讲解总结
2019/01/15 Javascript
Vue解析剪切板图片并实现发送功能
2020/02/04 Javascript
python用Pygal如何生成漂亮的SVG图像详解
2017/02/10 Python
Python实现的科学计算器功能示例
2017/08/04 Python
Python+树莓派+YOLO打造一款人工智能照相机
2018/01/02 Python
Python OpenCV实现图片上输出中文
2018/01/22 Python
修复CentOS7升级Python到3.6版本后yum不能正确使用的解决方法
2018/01/26 Python
Python切片操作深入详解
2018/07/27 Python
运用Python的webbrowser实现定时打开特定网页
2019/02/21 Python
python 申请内存空间,用于创建多维数组的实例
2019/12/02 Python
通过实例学习Python Excel操作
2020/01/06 Python
numpy库reshape用法详解
2020/04/19 Python
解决运行出现'dict' object has no attribute 'has_key'问题
2020/07/15 Python
Django URL参数Template反向解析
2020/11/24 Python
大课间体育活动方案
2014/03/12 职场文书
农林环境专业求职信
2014/03/13 职场文书
捐助贫困学生倡议书
2014/05/16 职场文书
八一建军节演讲稿
2014/09/10 职场文书
音乐之声观后感
2015/06/04 职场文书
会计实训总结范文
2015/08/03 职场文书
Mongo服务重启异常问题的处理方法
2021/07/01 MongoDB