jQuery AJAX 似乎沒有起火

Question

我在這里和其他地方盡可能多地搜索，試圖解決這個問題； 我似乎找不到足夠相似的東西。 按鈕單擊會在打印到控制台時觸發。 但是，我之后要求的每個控制台響應都沒有發生，這讓我相信 AJAX 調用本身沒有觸發。

<form type="GET" action="/api.php" id="search" name="search">
  <label for="getICAO">Search by ICAO:</label><br />
  <input type="text" id="getICAO" name="getICAO" placeholder="KLAX"><br />
  <label for="getCity">Search by city:</label><br />
  <input type="text" id="getCity" name="getCity"> <br />
  <label for="button"><input type="button" id="submit" name="submit" value="Find Airport"> </label><br />
</form>

<script>
jQuery("#submit").on("click", function(e) {
    e.preventDefault();
    console.log('submitted');
    // This part works ^

    // I have verified that the variables are passed to the PHP file. The PHP file is 
    //functioning properly and the database query returns with JSON formatted results.
    var getICAO = jQuery("#getICAO").val();
    var getCity = jQuery("#getCity").val();

    jQuery.ajax({
        type: "GET",
        url: "/api.php?getICAO="+getICAO+"&getCity="+getCity,
      dataType: "json",

    }) .done(function(data) {

            var result = jQuery.parseJSON(data);

            jQuery.each(result, function(key, value) {
               console.log(result); // Nothing returns
      });
   })     
});

</script>

這可能是一個我不明白的簡單錯誤。 謝謝您的幫助。

Answer 1

好的，我不知道這里的代碼是每件事還是只是表格
無論如何 Jquery 是一個 javascript 庫，您必須在要使用 Jquery 的每個頁面的頭部引用它（或者在正文中並不重要）

您可以下載它或使用 CDN：
https://jquery.com/download/

並且您不必為 html表單設置操作和方法
因為您已經在阻止 Default

最好讓 ajax 處理 GET 參數，如下所示：

jQuery.ajax({
    type: "GET",
    url: "/api.php",
    data: {
        getICAO: getICAO,
        getCity: getCity
    },
    dataType: "json"
})

這是工作頁面：

<!DOCTYPE html>
<html lang="en">

<head>
    <script src="https://code.jquery.com/jquery-3.4.1.js"></script>
</head>
<body>
    <form id="search" name="search">
        <label for="getICAO">Search by ICAO:</label><br />
        <input type="text" id="getICAO" name="getICAO" placeholder="KLAX"><br />
        <label for="getCity">Search by city:</label><br />
        <input type="text" id="getCity" name="getCity"> <br />
        <label for="button"><input type="button" id="submit" name="submit" value="Find Airport"> </label><br />
    </form>


    <script>
        jQuery("#submit").on("click", function(e) {
            e.preventDefault();
            console.log('submitted');
            // This part works ^

            // I have verified that the variables are passed to the PHP file. The PHP file is 
            //functioning properly and the database query returns with JSON formatted results.
            var getICAO = jQuery("#getICAO").val();
            var getCity = jQuery("#getCity").val();

            jQuery.ajax({
                type: "GET",
                url: "/api.php",
                data: {
                    getICAO: getICAO,
                    getCity: getCity
                },
            dataType: "json"

            })
            .done(function(data) {
                var result = jQuery.parseJSON(data);

                jQuery.each(result, function(key, value) {
                    console.log(result); // Nothing returns
                });
            })     
        });
    </script>
</body>

</html>

jQuery AJAX 似乎沒有起火

問題描述

1 個解決方案

解決方案1
1 2020-05-19 23:36:28

jQuery AJAX 似乎沒有起火

問題描述

1 個解決方案

解決方案1 1 2020-05-19 23:36:28

解決方案1
1 2020-05-19 23:36:28