$ .post提交表單之前內部Ajax可以運行

我不確定是否它的最佳做法做到這一點，但我有一個內置Ajax $ .post。問題是如果我從$ .post中刪除返回false，那麼表單將在Ajax運行之前提交。

$(".buy").submit(function(e) { 

    var url = "http://perfectprints.org.uk/Canvas/js/send_email.php"; 

    html2canvas($('.canvas-cut')).then(function(canvas) { 

    $('canvas').addClass('canvas-layout'); 
    var src = canvas.toDataURL(); 
    var output = src.replace(/^data:image\/(png|jpg);base64,/, ""); 
    $.post('image.php', { 
     data: output 
    }).done(function(response) { 
     alert("Done"); 
     $.ajax({ 
     type: "POST", 
     url: url, 
     data: { 
      shape: shape, 
      finish: finish, 
      ori: ori, 
      current_width: current_width, 
      current_height: current_height 
     }, 
     success: function(data) { 
      $('html,body').scrollTop(0); 
     } 
     }); 
    }); 

    }); 
    return false; 
});

這將只適用於如果返回false是爲了阻止$ .post射擊。我試圖嘗試提交表單後，Ajax完成，但它不會工作。

任何幫助或建議將是最受歡迎的。

謝謝。

來源

2017-11-17 Loki180

您需要決定想要做什麼，發佈表單或通過AJAX提交。如果在提交表單之前需要使用AJAX進行某種處理，那麼將submit按鈕更改爲普通按鈕，然後執行AJAX調用，並在AJAX返回成功時提交表單。 –

根據你想要完成的事情，你需要'form.submit（）'和/或'event.preventDefault（）'的組合。你可以使用'event.preventDefault（）'來停止提交，當你返回false時它也會自動觸發，但不像'return false;'不會中斷函數。然後使用'form.submit（）'和任何需要的條件邏輯來手動控制提交。 – mopsyd

更多相關信息，請訪問：https：//developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault – mopsyd

使用帶按鈕和ID的按鈕。
默認情況下，此元素未提交表單數據，可用於進行Ajax調用。

<button id="button_buy" type="button">Buy</button>

然後添加一個事件點擊這個按鈕並使用提交事件的實際代碼。

$("#button_buy").click(function(e) { 
    //code of $(".buy").submit 

    //inside ajax success fire submit event's form 
    //$('the_form).submit(); 

    //delete return false 
});

來源

2017-11-18 00:00:51

我會在這之前給Jorge，謝謝你花時間幫助我。 – Loki180

是不是，我在表單中添加了一個按鈕，並在成功時用submit（）重寫了$ .post和Ajax中的一些。謝謝大家的幫助。 – Loki180

$ .post提交表單之前內部Ajax可以運行

回答

相關問題