AJAX不會被調用

Question

我在與AJAX一個問題，因爲某些原因，要麼沒有被調用或不工作

$(document).ready(function() { 
    $("#my_form").submit(function(event) { 
    alert("submited"); 

    event.preventDefault("#my_form"); 

    var post_url = $(this).attr("action"); //get form action url 
    var request_method = $(this).attr("method"); //get form GET/POST method 
    var form_data = $(this).serialize(); //Encode form elements for submission 

    alert(post_url + "" + request_method + " " + form_data); 

    $.ajax({ 
     type: post_url, 
     url: request_method, 
     data: form_data, 
     success: function(data) { 
     alert(data); 
     $("server-results").html(data); 
     } 
    }); 

    $('#loadingDiv').hide().ajaxStart(function() { 
     $(this).show(); 
    }); 
    //.ajaxStop(function() { 
    // $(this).hide(); 
    //}); 
    }); 
}); 

我已經調試，就像我能有在JavaScript中激活表單函數或將3個變量傳輸到JS代碼塊中並不成問題。然而，ajaxStart沒有激活，這讓我相信問題只存在於ajax中。

我也檢查了鏈接到ajax，它似乎正在工作，但我不知道如果它的正確的鏈接，或者如果它無論出於任何原因無效。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 

僅供參考ajax鏈接位於HTML和JS之上的頁面頂部。

Answer 1

您已經通過錯誤的參數：

type: post_url, 
url: request_method, 

你需要傳遞POST_URL在URL和REQUEST_METHOD型。只需將其更改爲：

type: request_method, 
url: post_url, 

Answer 2

$（ 「服務器結果」）HTML（數據）;這裏如果服務器結果是一類或ID，因此服務器的輸出絕不頁面

jQuery .ajaxStart()

在jQuery的官方文檔中的報道，ajaxStart事件上進行打印尚未指定不能由#loadingDiv元素激活，但您必須使用該文檔。

$(document).ajaxStart(function() { 
    $(".log").text("Triggered ajaxStart handler."); 
}); 

總結代碼應該是這樣的。

$(document).ready(function() { 
    $("#my_form").submit(function(event) { 
    alert("submited"); 

    event.preventDefault("#my_form"); 

    var post_url = $(this).attr("action"); //get form action url 
    var request_method = $(this).attr("method"); //get form GET/POST method 
    var form_data = $(this).serialize(); //Encode form elements for submission 

    alert(post_url + "" + request_method + " " + form_data); 

    $.ajax({ 
     type: post_url, 
     url: request_method, 
     data: form_data, 
     success: function(data) { 
     alert(data); 
     $(".server-results").html(data); 
     } 
    }); 

    $(document).ajaxStart(function() { 
     $('#loadingDiv').show(); 
    }); 
    .ajaxStop(function() { 
     $('#loadingDiv').hide(); 
    }); 
    }); 
});