javascript - JavaScript で HTML5 入力検証をインターセプトする方法は?

Question

<form ... onsubmit="return false">
   <input type="text" name="location" ...>
   <input type="url" ... required>
   ...
</form>

ここで、場所を入力して ENTER を押すと、ブラウザは URL が必要であると通知しますが、これは期待または望ましい結果ではありません。ENTER は無視してください。

---

質問

「場所」入力フィールドでENTER を押した後、ブラウザーが必須フィールドをチェックしないようにするにはどうすればよいですか?form.submit()

Answer 1

フォーム要素の入力ボタンのデフォルトの動作を停止する必要があります。

例を見てみましょう：

HTML5フォームとして

<form id="form">
  <input type="text" name="test1" id="test1" required/>
  <input type="text" name="test2" id="test2" required/>
  <input type="submit" value="Test"/>
</form>

次に、以下のコードを適用します

$(document).ready(function() {
  $(form).find('input').on('keydown', function(e){
     if(e.which == 13) // KEY.ENTER = 13
       e.preventDefault();
  });
});

上記のシナリオに基づいて、ここにfiddleがあります。

Answer 2

フォーム要素でnovalidate属性を使用できます。

<form method="post" action="..." novalidate>...</form>

Answer 3

「提出」を処理するための特定の方法があります。ここだ！