如何让表单在提交之前等待ajax完成？

Question

因此,只有在使用ajax从数据库验证条件时才需要提交表单.我使用的preventDefault()方法,如果如果用户不是一个居民,一个变量设置为true的条件为真,即ajax successs function与preventDefault()被调用,但是,这样做的时候,形式总是提交.即使异步设置为false,它也不会等待ajax完成.这是代码.

  $('#button').click(function(e) {    
    if ($('#ca_resident').prop('checked') == true) { 
      amount=$('#user-amount').val().replace(/[,]/g,"");
      project_name=$('#project_name').val();
      var not_resident = false;
       $.ajax({
        url: '/main/verify_residence/',
        type: 'POST',
        aysnc: false,
        data: {
          value: amount,
          name: project_name
        },
        success: function(data){
          $("#verify_residence").html(data);
          not_resident = true;
        },
        dataType: 'html'
      }); 
    }
    if(not_resident){
      e.preventDefault();
    }
  });

Answer 1

这是行不通的.成功将在以下后发生:

if(not_resident){
      e.preventDefault();
    }

因为它是异步的.您需要始终取消按钮单击,然后在成功命中后提交表单:

$('#button').click(function(e) {    
   var $form = $(this).closest('form');   

   if ($('#ca_resident').prop('checked') == true) { 
      amount=$('#user-amount').val().replace(/[,]/g,"");
      project_name=$('#project_name').val();
       $.ajax({
        url: '/main/verify_residence/',
        type: 'POST',
        aysnc: false,
        data: {
          value: amount,
          name: project_name
        },
        success: function(data){
          $("#verify_residence").html(data);
          $form.submit();
        },
        dataType: 'html'
      }); 
    }


    e.preventDefault();

  });