KeyboardEvents

キー入力(Enterキー)を擬似入力させる

view source

JavaScript

$(function(){

  var chat = $('#play-input-chat');

  //キー擬似入力
  var inputText = function(text){
    chat.val(text).focus();
    try { 
      var _e = document.createEvent('KeyboardEvents');
      _e.initEvent(
        'keypress', // event type : keydown, keyup, keypress
        true,     // bubbles
        true,     // cancelable  
        window,   // viewArg: should be window  
        false,    // ctrlKeyArg  
        false,    // altKeyArg
        false,    // shiftKeyArg
        false,    // metaKeyArg
        13,       // keyCodeArg : unsigned long the virtual key code, else 0  
        0         //
      );
      _e.keyCode = 13;
      chat[0].dispatchEvent(_e); 
    } catch(e){
      console.log(e);
    }
    console.log(_e);

  };

  //簡易入力ボタンを生成
  var btnY = $('<button>').text('Y').addClass('btnY').on('click', function(){
    inputText('Y');
  });
  var btnN = $('<button>').text('N').addClass('btnN').on('click', function(){
    inputText('N');
  });
  chat.after(btnY).after(btnN);

  //イベント監視
  chat.on('keypress', function(){
    var val = $(this).val();
    alert(val);
  });
});

CSS

HTML

ページのソースを表示 : Ctrl+U , DevTools : F12

view-source:https://hi0a.com/demo/-js/js-simu-keyboard/

ABOUT

hi0a.com 「ひまアプリ」は無料で遊べるミニゲームや便利ツールを公開しています。

プログラミング言語の動作デモやWEBデザイン、ソースコード、フロントエンド等の開発者のための技術を公開しています。

必要な機能の関数をコピペ利用したり勉強に活用できます。

プログラムの動作サンプル結果は画面上部に出力表示されています。

環境:最新のブラウザ GoogleChrome / Windows / Android / iPhone 等の端末で動作確認しています。

画像素材や音素材は半分自作でフリー素材配布サイトも利用しています。LINK参照。

動く便利なものが好きなだけで技術自体に興味はないのでコードは汚いです。

途中放置や実験状態、仕様変更、API廃止等で動かないページもあります。