JavaScript 模拟键盘事件
原文链接:http://blog.csdn.net/lovelyelfpop/article/details/52471878
最近代码中有个功能需要用到手动触发键盘事件的功能。但键盘事件的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);
}
}
使用方法: 假设模拟回车
fireKeyEvent(input元素, 'keydown', 13);
JavaScript 模拟键盘事件的更多相关文章
- JavaScript 模拟键盘事件和鼠标事件(比如模拟按下回车等)
http://blog.csdn.net/lovelyelfpop/article/details/52471878# 封装好的function大概就是这样: function fireKeyEven ...
- JS模拟键盘事件 -- 原理及小例子
提问: 键盘默认事件,比如tab切换,alt+f4关闭,ctrl+t新建等,如果不想通过键盘而是一些按钮点击来触发这些功能,该咋办呢? 例子: 先以tab为例上一个小例子: <!DOCTYPE ...
- 初识 jquery.simulate.js 模拟键盘事件
用jquery 和 jquery.simulate.js 实现模拟键盘事件,点击上下左右div相当于点击键盘的上下左右键 <!DOCTYPE html> <html> < ...
- javascript的键盘事件大全
javascript的键盘事件大全 ------------------------------------------------------------------- 使用event对象的keyC ...
- selenium 模拟键盘事件 复制粘贴、右键、回车等
#coding=utf-8 ''' selenium ''' from selenium import webdriver as wd import time bc=wd.Chrome(executa ...
- 使用jquery模拟键盘事件,但window系统并不会真的响应事件,只是浏览器当前页面会响应而已
<!DOCTYPE html> <html> <head> <title>Demo</title> <meta http-equiv= ...
- JavaScript获取键盘事件
JavaScript中: onkeydown 事件会在用户按下一个键盘按键时发生. onkeypress 事件会在键盘按键被按下并释放一个键时发生. onkeyup 事件会在键盘按键被松开时发生. 支 ...
- C#模拟键盘事件
public partial class Form1 : Form { public Form1() { InitializeComponent(); } [DllImport("USER3 ...
- javascript之键盘事件
键盘事件包含onkeydown.onkeypress和onkeyup这三个事件 事件初始化 function keyDown(){} document.onkeydown = keyDown; ...
随机推荐
- Android开发——IntentFilter的匹配规则
1. IntentFilter中的过滤信息 启动Activity分为显式调用和隐式调用,前者没什么好讲的,后者需要Intent能够匹配目标组件的IntentFilter中所设置的过滤信息.包括act ...
- springboot集成redis操作
使用HashOperations操作redis----https://www.cnblogs.com/shiguotao-com/p/10560458.html 使用HashOperations操作r ...
- C++ char数组和string类简单使用总结
使用char数组,进行字符串的操作,是c风格的操作方式. string是C++的风格,感觉string本质上就是一个vector<char> 以下代码详细展示了字符串的常见操作 #incl ...
- python3--命名空间字典
命名空间字典 我们学到了模块的命名空间实际上是以字典的形式实现的,并且可以由内置属性__dict__显示这一点.类和实例对象也是如此:属性点号运算其实内部就是字典的索引运算,而属性继承其实就是搜索连结 ...
- main()中的参数argc, argv
转自:http://blog.csdn.net/eastmount/article/details/20413773 一.main()函数参数 通常我们在写主函数时都是void main()或int ...
- Codeforces Round #352 (Div. 1) B. Robin Hood
B. Robin Hood 讲道理:这种题我是绝对不去(敢)碰的.比赛时被这个题坑了一把,对于我这种不A不罢休的人来说就算看题解也要得到一个Accepted. 这题网上有很多题解,我自己是很难做出来的 ...
- 九度oj 题目1017:还是畅通工程
题目描述: 某省调查乡村交通状况,得到的统计表中列出了任意两村庄间的距离.省政府“畅通工程”的目标是使全省任何两个村庄间都可以实现公路交通(但不一定有直接的公路相连,只要能间接通过公路可达即可 ...
- POJ 2403 Hay Points
Hay Points Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 5735 Accepted: 3695 Descri ...
- 洛谷P2522 - [HAOI2011]Problem b
Portal Description 进行\(T(T\leq10^5)\)次询问,每次给出\(x_1,x_2,y_1,y_2\)和\(d\)(均不超过\(10^5\)),求\(\sum_{i=x_1} ...
- angular中ng-repeat去重
[html] view plain copy print?在CODE上查看代码片派生到我的代码片 <div ng-app="myApp" ng-controller=&quo ...