WebフォームをMacのコマンド+Returnキーで送信可能にするスクリプト（翻訳）

WebフォームをMacのコマンド+Returnキーで送信可能にするスクリプト（翻訳）

どうもこんにちは。Macユーザーがフォーム内の任意の場所でコマンド+Returnキーを押して送信可能にするのは、Webアプリを手軽にクールでモダンにする方法の1つです。

Webサイトによっては、Mac以外のプラットフォームでControl+Enterキーに割り当てていることがありますが、私は気にしません（実を言うと気にしていた時期もありました: 数年前にいくつかのWebアプリでControl+Enterキーによる送信を追加したところ、複数のWindowsユーザーやLinuxユーザーから「フォームが意図せず送信されてしまった」と苦情が寄せられたことがあります）。

私は非Appleユーザーの民度を云々したいわけではありませんが、以下のコードをアプリの冒頭に貼り付ければ、それだけでアプリに特別感が生まれてキビキビ動くようになります。使ってくれた方には私から感謝申し上げたいと思います。

以下のコードをコピペするだけで使えます。使う前に読まなくても結構です。

document.addEventListener('keydown', (event) => {
  if (event.key === 'Enter' && event.metaKey) {
    if (!document.activeElement) return
    const closestForm = document.activeElement.closest('form')
    if (closestForm) {
      event.preventDefault()
      closestForm.requestSubmit()
    }
  }
})

関連記事

Rails: スムーズなライブリロードを実現するHotwire Sparkをリリースしました（翻訳）