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 相关文章推荐
javascript一些实用技巧小结
Mar 18 Javascript
如何使用json在前后台进行数据传输实例介绍
Apr 11 Javascript
将list转换为json失败的原因
Dec 17 Javascript
Js实现滚动变色的文字效果
Jun 16 Javascript
一个仿糯米弹框效果demo
Jul 22 Javascript
Node.js中的模块机制学习笔记
Nov 04 Javascript
微信小程序 MINA文件结构
Oct 17 Javascript
jQuery动态添加与删除tr行实例代码
Oct 18 Javascript
js阻止默认右键的下拉菜单方法
Jan 02 Javascript
在vue中使用echarts图表实例代码详解
Oct 22 Javascript
解决vue无法侦听数组及对象属性的变化问题
Jul 17 Javascript
javascript操作向表格中动态加载数据
Aug 27 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
PHP完全二叉树定义与实现方法示例
2017/10/09 PHP
Thinkphp5.0 框架视图view的比较标签用法分析
2019/10/12 PHP
TP5框架实现的数据库备份功能示例
2020/04/05 PHP
JavaScript对象反射用法实例
2015/04/17 Javascript
JS函数的几种定义方式分析
2015/12/17 Javascript
基于jquery实现图片放大功能
2016/05/07 Javascript
移动端 一个简单易懂的弹出框
2016/07/06 Javascript
JavaScript如何实现跨域请求
2016/08/05 Javascript
第一次接触神奇的前端框架vue.js
2016/12/01 Javascript
Angular ng-repeat遍历渲染完页面后执行其他操作详细介绍
2016/12/13 Javascript
微信小程序 引用其他js文件实现代码
2017/02/22 Javascript
Angularjs上传文件组件flowjs功能
2017/08/07 Javascript
nodeJS微信分享
2017/12/20 NodeJs
jquery+css3实现熊猫tv导航代码分享
2018/02/12 jQuery
Vue Cli3 创建项目的方法步骤
2018/10/15 Javascript
在Web关闭页面时发送Ajax请求的实现方法
2019/03/07 Javascript
浅谈layui 绑定form submit提交表单的注意事项
2019/10/25 Javascript
JavaScript 替换所有匹配内容及正则替换方法
2020/02/12 Javascript
微信小程序语音同步智能识别的实现案例代码解析
2020/05/29 Javascript
javaScript实现一个队列的方法
2020/07/14 Javascript
深入解答关于Python的11道基本面试题
2017/04/01 Python
20个常用Python运维库和模块
2018/02/12 Python
更改Python的pip install 默认安装依赖路径方法详解
2018/10/27 Python
对python中Json与object转化的方法详解
2018/12/31 Python
如何为Python终端提供持久性历史记录
2019/09/03 Python
Python中实现输入超时及如何通过变量获取变量名
2020/01/18 Python
python爬虫基础知识点整理
2020/06/02 Python
Pycharm在指定目录下生成文件和删除文件的实现
2020/12/28 Python
HTML5拖拽文件上传的示例代码
2021/03/04 HTML / CSS
CK加拿大官网:Calvin Klein加拿大
2020/03/14 全球购物
Internet主要有哪些网络群组成
2015/12/24 面试题
初中美术教学反思
2014/01/29 职场文书
超市开学活动方案
2014/03/01 职场文书
党的群众路线教育实践活动自我剖析材料
2014/10/08 职场文书
小学少先队辅导员述职报告
2015/01/10 职场文书
六年级上册《闻官军收河南河北》的教学设计
2019/11/15 职场文书