react怎么模拟键盘事件

js模拟键盘事件方法

方法定义

export function fireKeyEvent(el, evtType, keyCode) {
  var evtObj;
  if (document.createEvent) {
      if (window.KeyEvent) {//firefox 浏览器下模拟事件
          evtObj = document.createEvent('KeyEvents');
          evtObj.initKeyEvent(evtType, true, true, window, true, false, false, false, keyCode, 0);
      } else {//chrome 浏览器下模拟事件
          evtObj = document.createEvent('UIEvents');
          evtObj.initUIEvent(evtType, true, true, window, 1);
          delete evtObj.keyCode;
          if (typeof evtObj.keyCode === "undefined") {//为了模拟keycode
              Object.defineProperty(evtObj, "keyCode", { value: keyCode });                       
          } else {
              evtObj.key = String.fromCharCode(keyCode);
          }
          if (typeof evtObj.ctrlKey === 'undefined') {//为了模拟ctrl键
              Object.defineProperty(evtObj, "ctrlKey", { value: true });
          } else {
              evtObj.ctrlKey = true;
          }
      }
      el.dispatchEvent(evtObj);
  } else if (document.createEventObject) {//IE 浏览器下模拟事件
      evtObj = document.createEventObject();
      evtObj.keyCode = keyCode
      el.fireEvent('on' + evtType, evtObj);
  }
}

方法调用

fireKeyEvent(document.getElementById('aa'),'keydown',40);

更多相关技术文章,请访问HTML中文网

以上就是react怎么模拟键盘事件的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » React 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏