JavaScript 模擬鍵盤事件和鼠標事件（比如模擬按下回車等）

最近代碼中有個功能需要用到手動觸發鍵盤事件的功能。但鍵盤事件的fire在各瀏覽器下實現不一樣，下面分別說明：



1. IE下沒什么問題，創建事件對象、對對象的keyCode屬性賦值，然后再拋出來就行了：

evtObj = document.createEventObject();
evtObj.keyCode=keyCode
el.fireEvent('on'+evtType, evtObj);
 

2. Firefox 需要通過document.createEvent創建KeyEvents對象，再通過initKeyEvent方法對事件對象初始化

evtObj = document.createEvent('KeyEvents');
evtObj.initKeyEvent( evtType, true, true, window, false, false, false, false, keyCode, 0 );
initKeyEvent 參考：https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/initKeyEvent 



3. Chrome/Safari/Opera

通過document.createEvent創建UIEvents對象，初始化后再在該對象上掛載按鍵值。

evtObj = document.createEvent('UIEvents'); 
evtObj.initUIEvent( evtType, true, true, window, 1 );
initUIEvent 參考：https://developer.mozilla.org/en-US/docs/Web/API/UIEvent/initUIEvent 



Chrome和Opera可以先將keyCode屬性delete掉后，再用Object.defineProperty方法重新為它賦值：

delete evtObj.keyCode;
Object.defineProperty(evtObj,"keyCode",{value:keyCode});


有些安卓瀏覽器，此法無效，需要用下面的方式：

Object.defineProperty(evtObj, 'keyCode', {
    get : function() { return this.keyCodeVal; }
});     
Object.defineProperty(evtObj, 'which', {
    get : function() { return this.keyCodeVal; }
});
evtObj.keyCodeVal = keyCode;


最后，封裝好的function大概就是這樣: 

function fireKeyEvent(el, evtType, keyCode){
    var doc = el.ownerDocument,
        win = doc.defaultView || doc.parentWindow,
        evtObj;
    if(doc.createEvent){
        if(win.KeyEvent) {
            evtObj = doc.createEvent('KeyEvents');
            evtObj.initKeyEvent( evtType, true, true, win, false, false, false, false, keyCode, 0 );
        }
        else {
            evtObj = doc.createEvent('UIEvents');
            Object.defineProperty(evtObj, 'keyCode', {
                get : function() { return this.keyCodeVal; }
            });     
            Object.defineProperty(evtObj, 'which', {
                get : function() { return this.keyCodeVal; }
            });
            evtObj.initUIEvent( evtType, true, true, win, 1 );
            evtObj.keyCodeVal = keyCode;
            if (evtObj.keyCode !== keyCode) {
                console.log("keyCode " + evtObj.keyCode + " 和 (" + evtObj.which + ") 不匹配");
            }
        }
        el.dispatchEvent(evtObj);
    } 
    else if(doc.createEventObject){
        evtObj = doc.createEventObject();
        evtObj.keyCode = keyCode;
        el.fireEvent('on' + evtType, evtObj);
    }
}