首页 > 代码库 > JS模拟键盘事件 -- 原理及小例子
JS模拟键盘事件 -- 原理及小例子
小例子:
(Chrome下可用,其他浏览器未测试,使用新方法,暂不考虑兼容性)
代码如下:
1 <input type="button" tabindex="-1" value="http://www.mamicode.com/点点点点点" id="btn"> 2 <input type="text" placeholder="1"> 3 <input type="text" placeholder="2"> 4 <input type="text" placeholder="3"> 5 <input type="text" placeholder="4"> 6 <input type="text" placeholder="5"> 7 <input type="text" placeholder="6"> 8 <script> 9 var nowEle=document;10 var inputs=[].slice.call(document.querySelectorAll("[type=text]"));11 inputs.forEach(function(el,i){12 el.onfocus=function(){13 nowEle=this;14 };15 /*el.onblur=function(){16 setTimeout(function() {17 nowEle=document;18 }, 0);19 };*/20 });21 btn.onclick=function(ev){22 // console.log(nowEle);23 var e=document.createEvent("KeyboardEvents");24 e.initKeyboardEvent("keydown",true,true,window,"U+0009"); // tab25 if(nowEle==inputs[inputs.length-1])nowEle=document;26 nowEle.focus && nowEle.focus();27 nowEle.dispatchEvent(e);28 // console.log(e);29 };30 document.onkeydown=function(ev){31 // console.log(ev.keyCode,ev.which,ev);32 };33 document.addEventListener("click",function(ev){34 for (var i = 0; i < inputs.length; i++) {35 if(inputs[i]==ev.target || btn==ev.target)return;36 };37 nowEle=document;38 },false);39 </script>
先点着试试。
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。