jQueryのsubmitメソッド

以前、私たちは次のような構造を使用していました:

javascript$('form').on('submit', function(event) {
  event.preventDefault();
});

この代わりに、jQueryでは直接 submit メソッドを使用することもできます。 このメソッドは、フォームにハンドラをバインドするか、 イベントを実行します:

javascript$('form').submit(function(event) {
  event.preventDefault();
});

次の例には、シンプルなフォームがあります。 submitメソッドを使用してイベントハンドラをバインドし、 テキストフィールドと、 タイプがsubmitのボタン(input)があります:

html<p>jQuery</p>
<form action="/">
  <div>
    <input type="text">
    <input type="submit">
  </div>
</form>
<span></span>

テキストフィールドにテキストを入力し、 ボタンをクリックしたときにこのテキストをチェックしてみましょう。 'jQuery'と入力した場合、 textと show メソッドを使用して、スパンに'Good!'というテキストを表示します。 それ以外の場合は、'Bad...'を表示します:

javascript$('form').submit(function(event) {
  event.preventDefault();
    if ($('input').first().val() === 'jQuery') {
      $('span').text('Good!').show();
      return;
    }
  $('span').text('Bad...').show();
});