自制简易jquery键盘监听插件

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script>
/**
 * 简易键盘监听事件
 * @author shine.s
 */
var KeyListener = (function(){
	var _debug = false;
	var _ups = {};
	var _mods = {
		‘shift‘: ‘shiftKey‘,
		‘ctrl‘: ‘ctrlKey‘,
		‘alt‘: ‘altKey‘,
	}
	var KEYS = {
			‘backspace‘: 8,
	        ‘tab‘: 9,
	        ‘enter‘: 13, ‘return‘: 13,
	        ‘pause‘: 19,
	        ‘caps‘: 20, ‘capslock‘: 20,
	        ‘escape‘: 27, ‘esc‘: 27,
	        ‘space‘: 32,
	        ‘pgup‘: 33, ‘pageup‘: 33,
	        ‘pgdown‘: 34, ‘pagedown‘: 34,
	        ‘end‘: 35,
	        ‘home‘: 36,
	        ‘ins‘: 45, ‘insert‘: 45,
	        ‘del‘: 46, ‘delete‘: 46,

	        ‘left‘: 37,
	        ‘up‘: 38,
	        ‘right‘: 39,
	        ‘down‘: 40,

	        ‘*‘: 106,
	        ‘+‘: 107, ‘plus‘: 107,
	        ‘-‘: 109, ‘minus‘: 109,
	        ‘;‘: 186,
	        ‘=‘: 187,
	        ‘,‘: 188,
	        ‘.‘: 190,
	        ‘/‘: 191,
	        ‘`‘: 192,
	        ‘[‘: 219,
	        ‘\\‘: 220,
	        ‘]‘: 221,
	        "‘": 222
	}
	var i;
    //小键盘
    for (i = 0; i < 10; i++) {
        KEYS[‘num-‘ + i] = i + 96;
    }
    //数字
    for (i = 0; i < 10; i++) {
        KEYS[i.toString()] = i + 48;
    }
    // f1-f24
    for (i = 1; i < 25; i++) {
        KEYS[‘f‘ + i] = i + 111;
    }
    //字母
    for (i = 65; i < 91; i++) {
        KEYS[String.fromCharCode(i).toLowerCase()] = i;
    }

	function addListener(keycode, callBack) {
		if(typeof(keycode) == ‘object‘) {
			$.each(keycode, function(k,v){
				_ups[k] = v;
			})
		} else {
			_ups[keycode] = callBack;
		}
	}

	function proccess(e) {
		keycode = e.which ? e.which : e.keyCode;
		if(_debug) {
			console.log("Now: "+keycode);
		}
		$.each(_ups, function(k,v) {
			var kArr = k.split(‘+‘);
			flag = true;
			if(kArr.length>1) {
				for(var i=0; i<kArr.length-1; i++) {
					var spec = kArr[i];
					if(_mods[spec]) {
						var flag = flag && e[_mods[spec]];
					}
				}
				var k = kArr[kArr.length-1];
			}
			if(KEYS[k] == ‘undefined‘) {
				return true;
			}
			if(flag && keycode == KEYS[k]) {
				return v();
			}
		})
	}

	if(_ups) {
		$(document).keyup(proccess);
	}

	function debug() {
		_debug = true;
	}

	return {
		debug: debug,
		addListener: addListener,
	};
})();

//test-demo
$(function(){
	KeyListener.addListener(‘c‘, c);
	KeyListener.addListener({
		‘left‘: left,
		‘right‘: function(){
			right(1, 6);
		},
		‘shift+alt+f‘: d,
		‘shift+e‘: e,
	});
	function left() {
		console.log(‘test‘);
	}
	function right(a, b) {
		console.log(a+b);
	}
	function c() {
		console.log(‘c‘);
	}
	function d() {
		console.log(‘D‘);
	}
	function e() {
		console.log(‘e‘);
	}
})
</script>
时间: 2024-10-12 15:25:16

自制简易jquery键盘监听插件的相关文章

使用HTML+CSS,jQuery编写的简易计算器后续(添加了键盘监听)

之前发布了一款简易的计算器,今天做了一下修改,添加了键盘监听事件,不用再用鼠标点点点啦 JS代码: var yunSuan = 0;// 运算符号,0-无运算;1-加法;2-减法;3-乘法;4-除法 var change = 0;// 属于运算符后需要清空上一数值 var num1 = 0;// 运算第一个数据 var num2 = 0;// 运算第二个数据 var cunChuValue = 0;// 存储的数值 $(function() { $(".number").click(f

移动端用js与jquery实时监听输入框值的改动

背景: 在一次移动端H5开发中,需要监听输入框值的实时变动. onchange事件肯定抛弃,因为只能失去焦点才触发. 而keyPress在Android可以触发,iOS不可以. 又不想用Android和iOS都可以触发的keyDown和keyUp. 于是,百度出了新东西:oninput![需要配合propertychange,兼容 IE9 以下版本] 用法: JS: if(isIE) { document.getElementById("input").onpropertychange

C#全局键盘监听(Hook)的使用

一.为什么需要全局键盘监听? 在某些情况下应用程序需要实现快捷键执行特定功能,例如大家熟知的QQ截图功能Ctrl+Alt+A快捷键,只要QQ程序在运行(无论是拥有焦点还是处于后台运行状态),都可以按下快捷键使用此功能... 这个时候在程序中添加键盘监听肯定不能满足需求了,当用户焦点不在App上时(如最小化,或者用户在处理其它事物等等)键盘监听就失效了 二.怎样才能实现全局键盘监听? 这里需要用到Windows API,源码如下:(可以作为一个工具类[KeyboardHook.cs]收藏起来) u

js/jquery 实时监听输入框值变化的完美方案:oninput &amp; onpropertychange

本文转载于 http://blog.163.com/lgh_2002/blog/static/44017526201341511112874/ Jquery绑定事件(bind和live的区别) js/jquery 实时监听输入框值变化的完美方案:oninput & onpropertychange js/jquery 实时监听输入框值变化的完美方案:oninput & onpropertychange 2013-05-15 11:01:12|  分类: jquery/javascrip |

JPanel添加键盘监听事件

因为在自己的游戏需求中谢了要用键盘控制飞机的移动,所以用到键盘监听事件,但是使用了JPanel之后添加了键盘监听事件,按相应的方向键飞机并没有反应.但是如果是为JFrame的内容面板加则会有反应. 为了使得能在JPanel里头使用键盘事件解决方法如下: 1.在JPanel里头添加键盘监听 this.addKeyListener(new KeyAdapter(){ public void keyPressed(KeyEvent e) { switch(e.getKeyCode()){ case K

【转】【C#】全局键盘监听

using System; using System.Collections.Generic; using System.Text; using System.Runtime.InteropServices; using System.Windows.Forms; using System.Reflection; namespace 梦琪动漫屋 { /// <summary> /// 键盘钩子/// </summary> class KeyboardHook { public ev

iOS键盘监听以及获取键盘高度

在文本输入时,界面会弹出键盘.有时,当文本输入框过低,被键盘遮挡,使用户无法看见输入框文本内容,这就使得用户体验过低. 所以需要我们对键盘进行监控并获取键盘高度,调节界面或文本框高度进行处理.如下图,文本输入框过低的情况: 像这样的情况,如若未作处理,输入框就会被键盘遮挡.这时,我们需要监听键盘事件,获取键盘高度,对文本框视图进行高度调整: 1 #import "ViewController.h" 2 3 @interface ViewController ()<UITextFi

html学习 - jquery事件监听详解

html学习 - jquery事件监听详解 html学习 - jquery事件监听详解 监听方法 监听方法参数解释 click参数 事件自动执行问题解决 bind方法 live方法 监听方法 在jquery里,监听的方法比较多,用的最多的就是简单的.click() .onchange() .pressdown() 所以这样很简单啊,直接使用就好了,只要符合参数规范就可以了.除了这个还有bind() live() 方法. 而addEventListener()同bind()方法是没有很大功能上的区

HTML5 键盘监听原理实现的抓怪兽游戏+代码

HTML5小游戏抓怪兽,应用Canvas等超多的HTML5技巧编写而成,下面来向大家汇报实现步骤: 1.创建游戏画布: .代码   var canvas = document.createElement("canvas"); var ctx = canvas.getContext("2d"); canvas.width = 512; canvas.height = 480; document.body.appendChild(canvas); 我们需要做的第一件事是