フォーム送信時のキーボードショートカットを設定する

2025-08-10

フォーム送信時のsubmitボタンの押下をキーボードショートカットでも行えるようにするjsコード。いちいち送信ボタンを押すのはちょっと面倒なので。

<form id="form">
  <textarea name="comment" id="comment" placeholder="コメント"></textarea>
  <button type="submit">送信</button>
</form>

const form = document.getElementById('form')
const textarea = document.getElementById('comment')

function submitForm(e) {
  e.preventDefault();
  //submit時の処理
}
form.addEventListener('submit', submitForm);

//キーボードショートカットの設定（Mac:⌘, Windows: Ctrl）
textarea.addEventListener('keydown', (e) => {
  if ((e.metaKey || e.ctrlKey) && e.key === 'Enter') {
    form.requestSubmit()
  }
})