[jQuery] サブミットイベントを取得する（.submit）

投稿日：2017年5月31日更新日：2018年5月2日

jQueryでsubmitイベントを取得するサンプルです。

サンプルソース

例）submit時、テキストボックスがブランクならエラーとしてsubmitを中断する。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>サンプル</title>
<script src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
$(function(){
  $('#fm1').submit(function(e){
    if($('#txt1').val() == ""){
      alert('テキストは必須です。');
      return false;
    }
  });
});
</script>
</head>
<body>
  <form id="fm1" action="xxx.php">
    <input type="text" id="txt1">
    <input type="submit" id="btn1" value="送信">
  </form>
</body>
</html>

<!DOCTYPE html>

<head>

$(function(){

$('#fm1').submit(function(e){

if($('#txt1').val() == ""){

alert('テキストは必須です。');

return false;

}

});

</script>

</head>

<body>

</form>

</body>

</html>

解説

.submitは、サブミットが行われる直前に呼ばれます。
falseを返すとサブミットはキャンセルされます。

執筆者：とら