<script type="text/javascript">
(function(){
/**
*dqKeys v1.0.0 | (c) 2016 www.findme.wang
*@params json keys 监听的按键
*@params bool isOrder 按键是否有相应的顺序
*@params Function sucFuc 完成按键的回调函数
*@params Function cancelFuc 完成按键取消后的回调函数
*@author lidequan
*/
var dqKeys = function(keys,isOrder,sucFuc,cancelFuc) {
// 函数体
return new dqKeys.fn.init(keys,isOrder,sucFuc,cancelFuc);
}
dqKeys.fn = dqKeys.prototype = {
'version':'1.0.0', //版本号
'author':'lidequan', //作者
'rightKeys':{}, //监听的按键{key:code},code为按键对应的ascii码
'curKeys':[], //当前按下的键
'sucFuc':null, //完成按键的回调函数
'cancelFuc':null, //完成按键取消后的回调函数
'isFinsh':false, //判断是否完成按键
'isOrder':false, //按键是否有相应的顺序
init:function(keys,isOrder,sucFuc,cancelFuc){
this.rightKeys=keys;
this.sucFuc=sucFuc;
this.cancelFuc=cancelFuc;
this.isOrder=isOrder;
return this;
},
listenkeys:function(){//监听用户键盘操作
var _self=this;
_self.addListener('keydown', function(oEvent){
var oEvent =oEvent || window.event;
if(!_self.arrayContain(_self.curKeys,oEvent.keyCode)){
if(_self.isOrder && _self.getNextKey() == oEvent.keyCode){
_self.curKeys.push(oEvent.keyCode);
}else if(!_self.isOrder){
_self.curKeys.push(oEvent.keyCode);
}
}
if(_self.checkResult(_self.rightKeys,_self.curKeys)){
if(_self.sucFuc && !_self.isFinsh){
_self.sucFuc();
}
_self.isFinsh=true;
}
});
_self.addListener('keyup', function(oEvent){
var oEvent =oEvent || window.event;
if(_self.checkResult(_self.rightKeys,_self.curKeys) && _self.isFinsh){
//完成按键,又取消的事件
if(_self.cancelFuc){
_self.cancelFuc();
}
}
_self.curKey=_self.remove(_self.curKeys,oEvent.keyCode);
_self.isFinsh=false;
});
},
arrayContain:function(arr,val){//判断数组中是否包含某个元素
return (arr.indexOf(val) == -1) ? false:true;
},
checkResult:function(json,arr){ //判断用户是否按下监听的所有按键
for(var i in json){
if(arr.indexOf(json[i])==-1){
return false;
}
}
return true;
},
remove:function(arr,val) { //从数组中移除某个元素
var index = arr.indexOf(val);
if (index > -1) {
arr.splice(index, 1);
}
return arr;
},
getNextKey:function(){ //获取下一次按键对应的ascii码
for(var i in this.rightKeys){
if(this.curKeys.indexOf(this.rightKeys[i])==-1){
return this.rightKeys[i];
}
}
return null;
},
addListener:function(ev,fn,bool){ //事件绑定
if (document.attachEvent) {
document.attachEvent('on' + ev, fn);
}else{
document.addEventListener(ev,fn,bool);
}
}
}
dqKeys.fn.init.prototype = dqKeys.fn;
window.dqKeys = window.$$= dqKeys;
})();
//1.测试
dqKeys({'a':65,'b':66},true,function(){
console.log('okey');
},function(){
console.log('cancel');
}).listenkeys();
//2.测试
var dqKeys=new $$({'c':67,'d':68},false,function(){
console.log('keys down ');
},function(){
console.log('keys cancel');
});
dqKeys.listenkeys();
</script>
相关推荐
构建具有进度条和音量控制功能的JS播放器
HTML5 Audio API 是构建现代 Web 应用程序中不可或缺的组件之一,它允许开发者直接在网页中嵌入音频播放功能,无需依赖第三方插件。通过使用这一API,开发者可以灵活地控制音频的播放、暂停、音量调节以及处理音频事件等,大大丰富了网页交互的体验。在Web开发中,事件驱动模型是一种常见的交互机制,它允许用户与网页元素进行互动,从而触发一系列由JavaScript控制的事件处理。事件监听器则是这一模型的核心组成部分,负责在特定事件发生时执行预定义的代码块。事件驱动模型由事件的触发和监听组成。
自定义js完成键盘事件监听
用快捷方式输入罗马字符 /** * @ProjectName: sfhk * @Author: 小王 * @Date: 2021/1/21 23:26 * @Description: 监听键盘事件打出罗马字符,这里需要Alt+数字1~0替换罗马字符1~10 * 键盘事件对应的键码: *keyCode 48 = 0 equal braceright *keyCode 49 = 1 exclam onesuperior *keyCode 50 = 2 quotedbl twosuperior
西门子博图指令(定时器操作三)
西门子博图定时器中复位定时器功能指令介绍
js 监听组合按键
其中key为你第一次的按键,后面的xxKey是你第二次按下的键名被触发,会在event中出现这个参数并且值为true。方法将一个事件处理函数绑定到。
三极管简单振荡电路实现:从零开始的实战示例
通过一个基础实例,手把手教你如何利用三极管构建简单的振荡电路,深入理解三极管在实际电路中的工作原理与应用技巧。
EBS开发_创建AP付款
--以下代码于20181002在Tony环境测试通过 /* BEGIN --mo_global.init('SQLAP'); apps.fnd_global.apps_initialize(user_id => 1110, resp_id => 50597, resp_appl_id => 20003); --mo_global.set_policy_context(...
Key管理设备按键事件
Key管理设备按键事件
STM32G0/G4电机控制中三角函数与浮点运算优化实战
三角函数(sin/cos)和浮点运算是电机矢量控制(FOC)的核心基础,直接影响Clark/Park变换、SVPWM及观测器的实时性与精度。在资源受限的MCU上,标准math.h库因无硬件FPU支持而引发严重时序抖动,导致电流环延迟、转矩脉动增大甚至系统复位。通过硬件加速(如STM32G4的CORDIC协处理器)或定制化定点算法(如STM32G0的查表+线性插值),可将sin/cos计算从数十微秒压缩至1–3 μs量级,提升30倍以上效率。该方案广泛适用于BLDC/PMSM驱动、伺服控制及高动态响应嵌入式运
JS_plus.key.addEventListener监听键盘按键
【代码】JS_plus.key.addEventListener监听键盘按键。
GD32F4xx 移植agile_modbus软件包与电能表通信
GD32F4XX 移植agile modbus软件包实现与DTSU电能表通信调试记录
A133在Android13上适配百兆以太网
NOTE] 【技术支持问题】问题背景/平台。
vue的app监听返回键
document.addEventListener('plusready', function (a) { var first = ''; plus.key.addEventListener('backbutton', function () { //获取地址栏目中的url var urls = location.hash.split('/')[1] ...
4、分布式发电系统中用于改善电能质量的有源、无源和混合滤波器
本文探讨了分布式发电系统中,尤其是光伏(PV)系统运行过程中引入的电能质量问题,并分析了有源滤波器、无源滤波器及混合滤波器在改善电能质量方面的应用。文章详细介绍了光伏系统的建模、最大功率点跟踪(MPPT)技术,以及谐波、电压波动等技术问题,同时对各类滤波器的拓扑结构和控制方法进行了系统性总结。通过仿真实例比较了不同滤波器在减少谐波方面的效果,为实际工程应用提供了参考依据。
CKEditor 4 textwatcher 插件按键过滤机制解析:从 movementkeys 手动测试到源码验证
本篇文章以仓库中 `tests/plugins/textwatcher/manual/movementkeys.md` 这一 Bender 手动测试用例为切入点,深入讲解 CKEditor 4 的 [textwatcher](https://link.gitcode.com/i/e86b433f1c8296f3a1d10d2f168d6068) 插件如何过滤光标移动键与修饰键、避免触发无意义的文本
Windows 下 OpenClaw(小龙虾) 安装全记录:从零到一的保姆级图文教程(持续更新中)
本文主要介绍了Windows 下 OpenClaw 安装全记录:从零到一的保姆级图文教程,希望能对学习使用OpenClaw 的同学们有所帮助。 文章目录 1. 背景 2. 实战教程 2.1 步骤一 安装Node.js 2.2 步骤二:安装并配置OpenClaw 2.3 步骤三:配置模型 2.4 步骤四:对话 3. 后续使用步骤
visio安装包
Microsoft Office Visio 是一款专业的制图软件。利用经过更新的形状、协作工具和数据链接图表,创建专业级图表以简化复杂的信息。
几款js键盘捕捉插件[转]
1、shortcut.js 下载地址:http://www.openjs.com/scripts/events/keyboard_shortcuts/shortcut.js 下面内容主要为官方文档的翻译,但也加入了一些我的理解。 使用说明 该类主要有两个方法组成:shortcut.add()、shortcut.remove(),下面分别介绍: shortcut.add(key,fu...
数学建模模型总结
这是本人在两年内准备参加数学建模竞赛搜集到的模型资料,已经经过了本人的筛选和整理,希望能够对准备参加数学建模竞赛的学弟学妹们提供一些帮助!
Javascript jQuery 快捷键插件 Firefox热键屏蔽
//usage:$(dom).keyman({key:"D",ctrl:true,callback:func}); $.fn.keyman = Keyman; function Keyman( opts ){ var CTRL = opts.ctrl||false; var SHIFT = opts.shift||false; var ALT = opts.alt||fal
IDEA的使用指南
IDEA基于java的使用手册,可以最快速的上手,在使用中不断的丰富自己的使用技巧.
终极指南:30分钟掌握Mousetrap.js键盘快捷键库
Mousetrap.js是一个轻量级的JavaScript键盘快捷键库,它让开发者能够轻松地为Web应用程序添加强大的键盘快捷键功能。这个简单但功能丰富的库只有2KB大小,无需任何外部依赖,支持所有主流浏览器。😊 ## 为什么选择Mousetrap.js? Mousetrap.js提供了无与伦比的灵活性和易用性。与其他快捷键库相比,它具有以下独特优势: 🔑 **无框架依赖** - 不需要
解决UEditor快捷键冲突:自定义按键映射完全指南
你是否遇到过UEditor编辑器快捷键与浏览器或其他应用冲突的问题?本文将详细介绍如何通过配置文件和代码修改,自定义UEditor的快捷键映射,解决冲突问题。 ## 快捷键冲突的常见场景 在使用UEditor富文本编辑器时,快捷键冲突是常见问题。例如,UEditor默认的保存快捷键`Ctrl+S`可能与浏览器的保存网页功能冲突,导致无法正常使用编辑器的保存功能。 UEditor的快捷键配置主
3步集成Mousetrap:打造极致键盘交互体验的轻量级JavaScript库
在当今Web应用追求极致用户体验的时代,键盘快捷键已成为提升生产效率的关键要素。Mousetrap作为一个专注于键盘事件处理的轻量级JavaScript库,以其简洁的API设计和卓越的性能表现,为开发者提供了构建高效键盘交互的完美解决方案。本文将深入解析Mousetrap的核心架构、应用场景和最佳实践,帮助技术决策者和开发者充分挖掘这一工具的价值。 ## 键盘快捷键管理的技术挑战与Mousetr
Johnny-Five Pin 模块实战指南:引脚读写、事件监听与状态查询
本指南以 Johnny-Five 官方 [Pin 文档](https://link.gitcode.com/i/bdd4d3fac0057d35475ba3b244945ad8) 为主线,结合 [lib/pin.js](https://link.gitcode.com/i/29c5c6f6144a3cb60c4b394f2a906f0c) 源码实现与 [test/pin.js](https://l
告别复杂键盘事件处理:Mousetrap让网页快捷键绑定如此简单
你是否还在为网页中的键盘快捷键处理而烦恼?编写繁琐的事件监听代码,处理不同浏览器间的兼容性问题,还要考虑各种组合键和序列键的情况?现在,有了Mousetrap这个轻量级的JavaScript库,这一切都变得简单了。本文将带你深入了解Mousetrap的API,学会如何轻松绑定和触发键盘事件,让你的网页交互体验更上一层楼。 ## Mousetrap简介 Mousetrap是一个用于处理JavaS...
从键盘到手势:Mousetrap.js触摸设备适配完全指南
Mousetrap.js是一款轻量级的JavaScript键盘快捷键处理库,能够帮助开发者轻松实现网页中的键盘交互功能。随着移动设备的普及,如何让基于Mousetrap.js开发的应用在触摸设备上也有良好的用户体验,成为了前端开发中的重要课题。本文将详细介绍如何使用Mousetrap.js及其插件,为触摸设备构建流畅的交互体验。 ## 为什么需要触摸设备适配? 在传统的桌面应用中,键盘快捷键极
深入HumanInput插件体系:读懂example_plugin源码,3步写出你的自定义输入事件插件
HumanInput 是一个体积极小(gzip 后仅约 8.1kb)、零外部依赖的 JavaScript 人体输入事件库,专门用来优雅地处理键盘快捷键、鼠标手势、触摸、手柄、语音识别等"人类产生"的事件。本文面向新手,带你读懂它的插件体系,并看懂 [src/example_plugin.js](https://link.gitcode.com/i/b96993d456d99c65fb6ff280e
SuperCopy插件原理与实战:解锁网页复制限制的前端技术解析
在Web前端开发中,CSS的user-select属性和JavaScript事件监听是控制网页文本选择与复制行为的核心技术。user-select: none; 能够禁止用户选中特定区域的文本,而JavaScript可以通过拦截copy、selectstart等事件来阻止默认复制操作,这些机制常用于保护版权内容、防止UI误选或在线考试防作弊。从技术价值看,这些限制在保护内容的同时,也可能影响用户正常的资料摘录与学习体验。因此,浏览器扩展工具应运而生,它们通过注入CSS规则和干预事件监听,在客户端临时解除限制
CKEditor 4 IME 组合输入(Composition Input)手动测试指南:验证日文、中文、阿拉伯文输入的正确性与稳定性
本文基于 CKEditor 4 仓库中的手动测试用例 [tests/core/editable/manual/typeime.md](https://link.gitcode.com/i/332794218523c9b05a94d8c51e876416) 及其配套页面 [tests/core/editable/manual/typeime.html](https://link.gitcode.co
1207



被折叠的 条评论
为什么被折叠?



