在AJAX調用中獲取數據

Question

我有一個按鈕，然后單擊按鈕，我想使用AJAX調用獲取JSON數據，這是我在按鈕單擊中嘗試的代碼。但它不起作用

    function loadXMLDoc() {
        var request = $.ajax({

            url: 'https://api.flightstats.com/flex/airports/rest/v1/json/iata/SAN?appId=952b68c2&appKey=9d5a372da9f88679ac97a60c1e0c58f9',
            type: 'POST',
            //data: $("#ganttForm").serialize(),
            dataType: 'json',
            accepts: {
                json: "application/json"
            },
            headers: {
                Accept: "application/json; charset=utf-8",
                "Content-Type": "application/json; charset=utf-8"
            },

            success: function (data) {
                alert('success')
                var data1 = $.parseJSON(data);
                alert(data1);
                //console.log(window.JSON.parse(data));
                //alert(obj.ganttdata) 
                //console.log($.parseJSON(data.d));
                //console.log(JSON.stringify(data1));
                createEmptyGanttChart1(data1);

            },

            complete: function () {
                alert('complete')
                //  console.log('complete 1!!!!!!!!!!!!!!!!!!!!!!!!');
            },
            failure: function () {
                alert('failure')
                //  console.log('complete 1!!!!!!!!!!!!!!!!!!!!!!!!');
            }
        });
    }

Answer 1

您正在嘗試執行跨域Ajax請求，因為它違反了同源策略 ，所以該請求不起作用。

但是，api.flightstats.com網站似乎確實支持jsonp-至少在我將URL修改為此時：

https://api.flightstats.com/flex/airports/rest/v1/jsonp/iata/SAN?appId=952b68c2&appKey=9d5a372da9f88679ac97a60c1e0c58f9
// Note the "p" that I've added here -----------------^

...它以jsonp格式返回響應。 因此，請嘗試以下代碼：

    var request = $.ajax({

        url: 'https://api.flightstats.com/flex/airports/rest/v1/jsonp/iata/SAN?appId=952b68c2&appKey=9d5a372da9f88679ac97a60c1e0c58f9',
        type: 'POST',
        //data: $("#ganttForm").serialize(),
        dataType: 'jsonp',   // NOTE the type is 'jsonp' not 'json'

        success: function (data) {
            alert('success')
            alert(data);
            createEmptyGanttChart1(data);  // NOTE no need to parse data

        },

        complete: function () {
            alert('complete')
            //  console.log('complete 1!!!!!!!!!!!!!!!!!!!!!!!!');
        },
        failure: function () {
            alert('failure')
            //  console.log('complete 1!!!!!!!!!!!!!!!!!!!!!!!!');
        }
    });

演示： http ： //jsfiddle.net/Lc8H8/

注意，不需要使用$.parseJSON(data)因為jQuery會自動為您解析響應，並且data已經是一個對象。

Answer 2

嘗試這樣的事情

改變這個

dataType: 'json',

至

dataType: 'jsonp',