Edited at

タブキーを押すとフォーカスが移動してしまうせいでタブをテキストとして入力できないウェブサービス(Google Keep など)でタブを入力できるようにする方法

More than 3 years have passed since last update.

Chrome の拡張を作って下記のコードを実行させれば、カーソル位置にタブ(\t)を挿入させることができます。

document.onkeydown = function (e) {

if (e.keyCode === 9) {
e.preventDefault();
event.returnValue = false;
document.execCommand('insertText',false , '\t');
}
};

実際に Google Keep でタブを入力できるようにする Chrome 拡張を作ってみました。


説明

Google Keep などでは tab キーを押すとフォーカスが別の HTML 要素に移ってしまうため、タブをテキストとして入力できません。

(タブをクリップボードにコピーしておいて貼り付ければ、可能ですが、手間がかかるので現実的ではありません・・・)

上記のコードでは、tab のデフォルトの動作を無効にして、document.execCommand('insertText',false , '\t'); を使うことで \t を入力しています。


その他の使いドコロ

Google Keep 以外のサービスでも使えると思います。

また、自分がウェブサービスを作る場合でも同様の方法をつかえば textarea にタブを入力できるようになります。