スキルアップを始める!

【WordPress】エンターキーENTERでの submit(送信ボタン)押下を無効にする方法

WordPress(ワードプレス)
WordPress(ワードプレス)
この記事は約2分で読めます。

※記事中に広告情報を含みます。

スキルを手に入れた時、人は強くなれる。
Youtubeでスキルアップを始める 電子書籍でスキルアップを始める
\ワードプレスのスキルアップはこちら!/ WordPress入門読本

ENTERキーでsubmit(送信)が動く

エンターキーで送信ボタンが押せてしまうと、入力途中でうっかりログインを押してしまう・・・ということがあるかもしれません。

これは、HTMLの仕様がそうなっているからのようですが、なんとか制御できないかな・・というときの方法です。

submitをbuttonに変更する

これで、ENTERキーを押してもログインボタンが反応しなくなります。

ただ、この方法を設定した場合、SUBMITで何かの動作をしている場合、動作しなくなる可能性があります。

Javascritで制御する

<script>
document.getElementById("myform-no1").onkeypress = (e) => {
  // formに入力されたキーを取得する
  const key = e.keyCode || e.charCode || 0; 
  if (key == 13) {
    e.preventDefault();
  }
}
</script>

※キーコードを間違えると、他のキーが動かなくなるので注意

Event.preventDefault()

これで、ENTERキーが効かなくなりました。

ご参考下さい。

※予期せぬ動作になる可能性があるので、設定にはくれぐれもご注意下さい。

URLをコピーしました!