javascript 組合按鍵事件監(jiān)聽(tīng)實(shí)現(xiàn)代碼

JS組合按鍵事件監(jiān)聽(tīng)，支持同時(shí)監(jiān)聽(tīng)多組按鍵如{a,b,c,}{ctrl,c}。

實(shí)例代碼：

<script type="text/javascript">    (function(){     /**     *dqKeys v1.0.0 | (c) 2016 www.findme.wang     *@params json keys 監(jiān)聽(tīng)的按鍵     *@params bool isOrder 按鍵是否有相應(yīng)的順序     *@params Function sucFuc 完成按鍵的回調(diào)函數(shù)     *@params Function cancelFuc 完成按鍵取消后的回調(diào)函數(shù)     *@author lidequan     */     var dqKeys = function(keys,isOrder,sucFuc,cancelFuc) {       // 函數(shù)體       return new dqKeys.fn.init(keys,isOrder,sucFuc,cancelFuc);     }     dqKeys.fn = dqKeys.prototype = {       'version':'1.0.0',  //版本號(hào)       'author':'lidequan', //作者       'rightKeys':{},   //監(jiān)聽(tīng)的按鍵{key:code},code為按鍵對(duì)應(yīng)的ascii碼        'curKeys':[],    //當(dāng)前按下的鍵       'sucFuc':null,    //完成按鍵的回調(diào)函數(shù)       'cancelFuc':null,  //完成按鍵取消后的回調(diào)函數(shù)       'isFinsh':false,  //判斷是否完成按鍵       'isOrder':false,  //按鍵是否有相應(yīng)的順序       init:function(keys,isOrder,sucFuc,cancelFuc){         this.rightKeys=keys;         this.sucFuc=sucFuc;         this.cancelFuc=cancelFuc;         this.isOrder=isOrder;                   return this;       },       listenkeys:function(){//監(jiān)聽(tīng)用戶鍵盤(pán)操作                 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){//判斷數(shù)組中是否包含某個(gè)元素           return (arr.indexOf(val) == -1) ? false:true;       },       checkResult:function(json,arr){ //判斷用戶是否按下監(jiān)聽(tīng)的所有按鍵         for(var i in json){            if(arr.indexOf(json[i])==-1){              return false;            }          }         return true;       },       remove:function(arr,val) { //從數(shù)組中移除某個(gè)元素               var index = arr.indexOf(val);          if (index > -1) {            arr.splice(index, 1);          }          return arr;       },       getNextKey:function(){ //獲取下一次按鍵對(duì)應(yīng)的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.測(cè)試   dqKeys({'a':65,'b':66},true,function(){                   console.log('okey');                 },function(){                   console.log('cancel');                 }).listenkeys();     //2.測(cè)試   var dqKeys=new $$({'c':67,'d':68},false,function(){                   console.log('keys down ');                 },function(){                   console.log('keys cancel');                 });   dqKeys.listenkeys();   </script>