【WordPress】Enterで送信してしまうのを修正【ContactForm7】

こちらのサイトをかなり参考にしました

WordPressで作ったメールフォームで、Enterを押すと確認なしで自動送信されてしまう問題を修正しました。

Enterの扱いについてはContactForm7からだと直接変更することは出来ないみたいです。

例えばフォーム内での[email* your-email 60/60]はHTMLを見ると

  <span class="wpcf7-form-control-wrap your-email"><input type="email" name="your-email" value="" size="60" maxlength="60" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" aria-required="true" aria-invalid="false" />

と自動変換されていました。

WordPress編集画面の[外観]→[テーマの編集]→header.phpに以下のコードを挿入することで解決しました。

<script>
//Enterキーが押されても送信（submit）しない
function submitStop(e){

  if (!e) var e = window.event;
  if(e.keyCode == 13)
  return false;
}
//list[i].type == {htmlのinput type} で対象のtypeでのenter無効を適用させる
window.onload = function (){
  var list = document.getElementsByTagName("input");
  for(var i=0; i<list.length; i++){
    if(list[i].type == 'email' || list[i].type == 'password'|| list[i].type == 'text'|| list[i].type == 'number'){
      list[i].onkeypress = function (event){
        return submitStop(event);
      };
    }
  }
}
</script>