javascript - 为什么 PreventDefault() 不停止此表单提交的重定向？

Question

我一直在尝试使用 jQuery 提交此表单，但在提交后我似乎无法阻止它重定向。我哪里出错了？

我的表单已简化:

<form action="http://xxxxxxx" method="post" id="myform">
  <input type="text" name="my_field">
  <a class="last">Submit<a>
</form>

JS:

$('.last').on('click', function() {
  if ($('#myform').valid()) {
    $('#myform').submit();
  }

  $('#myform').on('submit', function(event) {
    event.preventDefault();

    $.getJSON(
      this.action + "?callback=?",
      $(this).serialize(),
      function(data) {
        if (data.Status === 400) {
          alert(data.Message);
          $('#noti').text(error).addClass('notice-error', function() {
            $('.last').attr('id', '#contact-us-btn').addClass('button-error').html('Contact us');
          });
          $('#contact-us-btn').on('click', function() {
            zE(function() {
              zE.show();
            });
          });
        } else {
          console.log(data.Message);
          $('#step-3').slideUp(function() {
            $('#noti').text(success).addClass('text-success');
            $('.next, .previous').fadeOut();
            $('.panel.success').slideDown();
          });
        }
      }
    )
  });
});

Answer 1

这不是顺序，问题是第二个事件是在第一个事件函数内分配的(基本上它会在点击后分配，因此表单提交)。

$('.last').on('click', function() {
  if ($('#myform').valid()) {
    $('#myform').submit();
  }
});

$('#myform').on('submit', function(event) {
  event.preventDefault();

  $.getJSON(
    this.action + "?callback=?",
    $(this).serialize(),
    function(data) {
      if (data.Status === 400) {
        alert(data.Message);
        $('#noti').text(error).addClass('notice-error', function() {
          $('.last').attr('id', '#contact-us-btn').addClass('button-error').html('Contact us');
        });
        $('#contact-us-btn').on('click', function() {
          zE(function() {
            zE.show();
          });
        });
      } else {
        console.log(data.Message);
        $('#step-3').slideUp(function() {
          $('#noti').text(success).addClass('text-success');
          $('.next, .previous').fadeOut();
          $('.panel.success').slideDown();
        });
      }
    }
  )
});