Enterキーでsubmitを防止するバリデーションを作成したい

Question

Enterキーでsubmitを防止するjqueryを記述しています。
こちらのjQueryをjavascriptに変換したいのですが、うまくいきません。
以下にjavascriptに変換したコードを記述しておりますが、どう修正すれば、
うまくいくのでしょうか？
ご教授のほどよろしくお願いいたします。

以下jQueryをJavascriptに修正したいのですが、

<form id="myForm" method="post">
<table>
<tr>
<th><label for="formName">名前 <span class="ind">必須</span></label></th>
<td><input type="text" name="formName" id="formName"></td>
</tr>
<tr>
<th><label for="formFurigana">ふりがな <span class="ind">必須</span></label></th>
<td><input type="text" name="formFurigana" id="formFurigana"></td>
</tr>
<tr>
<th><label for="formTell">電話番号 <span class="ind">必須</span></label></th>
<td><input type="text" name="formTell" id="formTell"></td>
</tr>
<tr>
<th><label for="formMail">メールアドレス <span class="ind">必須</span></label></th>
<td><input type="text" name="formMail" id="formMail"></td>
</tr>
<tr>
<th><label for="formInquiry">お問い合わせ内容 <span class="ind">必須</span></label></th>
<td><textarea rows="9" name="formInquiry" id="formInquiry"></textarea></td>
</tr>
</table>
<p><input type="submit" value="送信内容を確認する"></p>
</form>

html,body,div,p,table,tr,th,td,form,ul,li{
	margin: 0;
	padding: 0;
}

img{
	border: none;
}

body{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 14px;
	line-height: 20px;
	margin: 24px;
}

div{
	width: 695px;
}

li{
	list-style: none;
}

form{
}

table{
	width: 100%;
	margin: 0 0 12px;
	border-collapse: collapse;
	border-spacing: 0;
}

th,
td{
	padding: 8px 12px;
	border: 1px solid #ddd;
	text-align: left;
	vertical-align: middle;
}

th{
	width: 180px;
	background: #eee;
	font-weight: normal;
}

th span{
	font-size: 12px;
}

th .ind{
	color: #f00;
	font-size: 14px;
}

td{
	background: #fff;
}

td input{
	width: 250px;
}

td textarea{
	width: 464px;
}

.errorMsg{
	display: block;
	color: #f00;
}

.errorInput{
	background: #fcf0f2;
}

$(function () {
	function setMyForm(target) {
					target.find('input[type=text]').on({
						'keypress': function(e){
							if( (e.keyCode == 13) ) return false;
						}
					});
				}
	setMyForm($('#myForm'));
});

//ためしたこと

(function () {
	var inputText = document.querySelectorAll('input[type="text"]')
	for (let i = 0; i < length; i++) {
		inputText[i].addEventListener("keypress", function (e) {
			if (e.keyCode == 13) {
				return false;
			}
		});
	}
})();

Answer 1

inputText.lengthと書かないと要素数が取得できません。
また、既存のアクションを取り消すにはpreventDefault()を用いてください。

var inputText = document.querySelectorAll('input[type="text"]')
for (let i = 0; i < inputText.length; i++) {
  inputText[i].addEventListener("keypress", function (e) {
    if (e.keyCode == 13) {
      e.preventDefault();
    }
  });
}

Comments

[MTON]

ご返信ありがとうございます。
記述して頂いたコードに修正したのですが、enterを押すとやはりリロードされてしまいます。

[soliste16]

以下のcodepenではこのコードでリロードされませんがいかがでしょうか。
https://codepen.io/soliste16/pen/BaopBzW

[MTON]

ご返信ありがとうございます。
jsの記述を</body>の直前にもってきたらできました。
すみません、ありがとうございます。